iabpassing / using varles between script blocks

[nisiwi]

Looking for some guidance from somebody with more JS experience than myself.

The following (extract) code which was part of a pop up used to display content in a window and worked fine;

function initADP(){bdf=0;
// *** Begin advanced user scripting area ***
 htmlstring="<iframe src=\"http://www.giftsandmerchandise.co.uk/wp-content/plugins/adp-pro/childenquiryformpopup/display_form.php\" name=\"adpiframe\" id=\"adpiframe\" width=100% height=100% align=\"center\" Frameborder=\"0\" Scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\"></iframe>";
 enquiryPopup = new DFS.adp.adpInstance("enquiryPopup", 1, "#2564C0", 0, 0, 10, 3, 0, 0, 0, 0, 0, 1, 3, 0, 0, 0, 0, 0, -40, 30, 315, 720, 0, "#0F0F0F", "#3DA9D1", "#76C9EE", 1, 3, "#0F0F0F", 0, 0, 1, 0, 0, "8pt Arial", "#1C5EA2", 0, 0);
 enquiryPopup.adp("enquiryPopup",htmlstring,"");
// *** End advanced user scripting area ***
}
if(window.attachEvent){window.attachEvent('onload', initADP);}else{if(typeof window.onload == 'function'){var preADP = window.onload;window.onload = function(){preADP();initADP();}}else{window.onload = initADP;}}
}

However, the content (displayed in the iframe) was dynamic and relied on session variables passed from wordpress which was adding an overhead. To reduce the dynamic nature, session variables were replaced with variables passed in the URL as the data is not a security risk and the output can be cached fully minimizig any overhead as future request would like for the cached output file instead of rebuilding the pop up each time.

The page calling the script (which contains the code above) now has the following variables declared;

<script type="text/javascript">
var pop_parent_page = "<?php echo $wp_query->post->post_parent; ?>";
var pop_child_page_id = "<?php echo $wp_query->post->ID; ?>";
var pop_page_title = "<?php echo get_the_title($wp_query->post->ID); ?>";
</script>

These are declared outside of any functions so should be global and I thought would be accessible by the script.

And then I modified the script above to concatenate the string along with these variables, like so;

function initADP(){bdf=0;
// *** Begin advanced user scripting area ***
htmlstring="<iframe src=\"http://www.giftsandmerchandise.co.uk/wp-content/plugins/adp-pro/childenquiryformpopup/display_form.php?popchildid=" + pop_child_page_id + "&popparent=" + pop_parent_page + "&poptitle=" + pop_page_title + "\" name=\"adpiframe\" id=\"adpiframe\" width=100% height=100% align=\"center\" Frameborder=\"0\" Scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\"></iframe>";
enquiryPopup = new DFS.adp.adpInstance("enquiryPopup", 1, "#2564C0", 0, 0, 10, 3, 0, 0, 0, 0, 0, 1, 3, 0, 0, 0, 0, 0, -40, 30, 315, 720, 0, "#0F0F0F", "#3DA9D1", "#76C9EE", 1, 3, "#0F0F0F", 0, 0, 1, 0, 0, "8pt Arial", "#1C5EA2", 0, 0);
enquiryPopup.adp("enquiryPopup",htmlstring,"");
// *** End advanced user scripting area ***
}
if(window.attachEvent){window.attachEvent('onload', initADP);}else{if(typeof window.onload == 'function'){var preADP = window.onload;window.onload = function(){preADP();initADP();}}else{window.onload = initADP;}}
}

Is this the correct approach ?

[nisiwi]

apologies the title is incorrect - it should read

passing / using variablees between script blocks

[nisiwi]

I've given this a try and it does not appear to be working. What am I doing wrong ?

[daveVk]

Start by viewing page source and see whats generated here

<script type="text/javascript">
var pop_parent_page = "<?php echo $wp_query->post->post_parent; ?>";
var pop_child_page_id = "<?php echo $wp_query->post->ID; ?>";
var pop_page_title = "<?php echo get_the_title($wp_query->post->ID); ?>";
</script>

consider adding alert on htmlstring

alert( htmlstring );
enquiryPopup.adp("enquiryPopup",htmlstring,"");

is htmlstring intended to be same in both cases ?

[nisiwi]

Many thanks daveVk for offering to help.

I was certain that I had checked the output for those variables. However it turns out that I had not (and must have modified somethings) as straight away we have a problem (missing ID's);

<script type="text/javascript">
var pop_parent_page = "";
var pop_child_page_id = "";
var pop_page_title = "Hanging Bags";
</script>

Looks like I'd removed;

global $wp_query;

Thats now resolved and I'm updating the CDN with the modified script (containing - alert) so that I can check the output there (handy test).

[nisiwi]

p.s. not sure what you meant by;

is htmlstring intended to be same in both cases ?

you mean the same variable - yes - so alert should work

[nisiwi]

And now on a non cache page the alert window tells me.....the pop up now works....hoorah!

<iframe src="http://www.THEDOMAIN.EXT/PATH/popup.php?popupchildid=1971&popupparent=1250&popuptitle=Ad Bags" name="adpiframe" id="adpiframe" width=100% height=100% align="center" Frameborder="0" Scrolling="no" marginheight="0" marginwidth="0"></iframe>

Thank you for those pointers daveVk.

[Fotiman]

<iframe src="http://www.THEDOMAIN.EXT/PATH/popup.php?popupchildid=1971&popupparent=1250&popuptitle=Ad Bags"

You have a space in there. That would be particularly problematic if any of your page title's have an ampersand in them, as you'd end up with something like:

<iframe src="http://www.THEDOMAIN.EXT/PATH/popup.php?popupchildid=1971&popupparent=1250&popuptitle=Me, Myself, & I"

Which would not give you the correct results because & is the separator of URI components in the query string.

Make sure you call encodeURIComponent on the values:

<script type="text/javascript">
var pop_parent_page = encodeURIComponent("<?php echo $wp_query->post->post_parent; ?>");
var pop_child_page_id = encodeURIComponent("<?php echo $wp_query->post->ID; ?>");
var pop_page_title = encodeURIComponent("<?php echo get_the_title($wp_query->post->ID); ?>");
</script> 

[nisiwi]

As the first two vars will always be numbers Fotiman, I'll just encode the pop_page_title. Thank you for pointing that out Fotiman.