Why won't Javascript assembled Iframe load in IE6 over HTTPS although it will over HTTP?
- by Lauren
The issue: The iframe won't load inside the tags on the review and submit page here:
https://checkout.netsuite.com/s.nl/c.659197/sc.4/category.confirm/.f
Login:[email protected]
pass:test03
To produce problem:
- Where it says "Your Third Party Shipper Numbers (To enter one, click here.)", click "here" to see the form that won't load in IE6. It seems to load in every other modern browser.
The same form works fine on this page (you have to click on the "order sample" button to see the link to the same form):
http://www.avaline.com/R3000_3
Here's the HTML:
<div style="border-color: rgb(255, 221, 221);" id="itmSampl">
<div id="placeshipnum" style="display: none;"></div>
<div id="sampAdd">
<strong>Your Third Party Shipper Numbers</strong> (To enter one, click <a rel="nofollow" href="javascript:;" onclick="enterShipNum()">here</a>.)
<ul style="list-style: none outside none; padding-left: 20px;">
<li><span class="bold">UPS #</span>: 333333</li>
<li><span class="bold">FedEx #</span>: 777888999</li>
</ul>
</div>
</div>
Upon clicking the "to enter one, click here" link this is the iframe HTML in all browsers except IE6 (in IE6, the "shipnum" div element is assembled, but that's it):
<div id="placeshipnum" style="display: block;">
<div id="shipnum" style="background: none repeat scroll 0% 0% rgb(255, 255, 255);">
<div class="wrapper-x"> <a title="close window" class="linkfooter" href="javascript:;" onclick="enterShipNum()"> <img height="11" width="11" alt="close window" src="/c.659197/site/av-template/x-image-browser.gif"> </a> </div>
<iframe scrolling="no" height="240" frameborder="0" width="190" src="https://forms.netsuite.com/app/site/crm/externalleadpage.nl?compid=659197&formid=56&h=9b260d2f9bca0fd9c300&[email protected]&firstname=Test&lastname=Account&ck=Q1BnzaRXAe_RfjhE&vid=Q1BnzaRXAd3Rfik7&cktime=87919&cart=5257&promocode=SAMPLE&chrole=1014&cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb" allowtransparency="true" border="0" onload="hideShipLoadImg()" style="display: block;"></iframe></div></div>
This is the relevant Javascript:
// Allow for shipper number update
var shipNumDisplay=0;
function enterShipNum() {
if (shipNumDisplay == 0){
//odrSampl();
document.getElementById('placeshipnum').style.display="block";
document.getElementById('placeshipnum').innerHTML='<div id="shipnum"><div class="wrapper-x"> <a onclick="enterShipNum()" href="javascript:;" class="linkfooter" title="close window"> <img height="11" width="11" src="/c.659197/site/av-template/x-image-browser.gif" alt="close window" /> </a> </div><iframe onload="hideShipLoadImg()" scrolling="no" height="240" frameborder="0" width="190" border="0" allowtransparency="true" src="https://forms.netsuite.com/app/site/crm/externalleadpage.nl?compid=659197&formid=56&h=9b260d2f9bca0fd9c300&[email protected]&firstname=Test&lastname=Account&ck=Q1BnzaRXAe_RfjhE&vid=Q1BnzaRXAd3Rfik7&cktime=87919&cart=5257&promocode=SAMPLE&chrole=1014&cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb"></iframe></div>';
shipNumDisplay=1;
}
else {
document.getElementById('placeshipnum').style.display="none";
document.getElementById('shipnum').parentNode.removeChild(document.getElementById('shipnum'));
shipNumDisplay=0;
}
}
function hideShipLoadImg(){
var shipiframe= document.getElementById('shipnum').getElementsByTagName('iframe')[0];
shipiframe.style.display = 'block';
shipiframe.parentNode.style.background = '#fff';
}
This is most of the form inside the iframe although I don't think it's relevant:
<form style="margin: 0pt;" onsubmit="return ( window.isinited && window.isvalid && save_record( true ) )" action="/app/site/crm/externalleadpage.nl" enctype="multipart/form-data" method="POST" name="main_form" id="main_form">
<div class="field name">
<label for="firstname">First Name <span class="required">*</span></label> <span class="input" id="firstname_fs"><span class="input" id="firstname_val">Test</span></span><input type="hidden" id="firstname" name="firstname" value="Test" onchange="nlapiFieldChanged(null,'firstname');">
</div>
<div class="field name">
<label for="lastname">Last Name <span class="required">*</span></label> <span class="input" id="lastname_fs"><span class="input" id="lastname_val">Account</span></span><input type="hidden" id="lastname" name="lastname" value="Account" onchange="nlapiFieldChanged(null,'lastname');">
</div>
<div id="ups" class="field">
<label for="custentity4">UPS # </label> <span id="custentity4_fs" style="white-space: nowrap;"><input type="text" id="custentity4" onblur="if (this.checkvalid == true) {this.isvalid=(validate_field(this,'text',false,false) && nlapiValidateField(null,'custentity4'));} if (this.isvalid == false) { selectAndFocusField(this); return this.isvalid;}" name="custentity4" size="25" onfocus="if (this.isvalid == true || this.isvalid == false) this.checkvalid=true;" onchange="setWindowChanged(window, true);this.isvalid=(validate_field(this,'text',true,false) && nlapiValidateField(null,'custentity4'));this.checkvalid=false;if (this.isvalid) {nlapiFieldChanged(null,'custentity4');;}if (this.isvalid) this.isvalid=validate_textfield_maxlen(this,6,true,true);if (!this.isvalid) { selectAndFocusField(this);}return this.isvalid;" class="input" maxlength="6"></span>
</div>
<div id="fedex" class="field">
<label for="custentity9">FedEx # </label> <span id="custentity9_fs" style="white-space: nowrap;"><input type="text" id="custentity9" onblur="if (this.checkvalid == true) {this.isvalid=(validate_field(this,'text',false,false) && nlapiValidateField(null,'custentity9'));} if (this.isvalid == false) { selectAndFocusField(this); return this.isvalid;}" name="custentity9" size="25" onfocus="if (this.isvalid == true || this.isvalid == false) this.checkvalid=true;" onchange="setWindowChanged(window, true);this.isvalid=(validate_field(this,'text',true,false) && nlapiValidateField(null,'custentity9'));this.checkvalid=false;if (this.isvalid) {nlapiFieldChanged(null,'custentity9');;}if (this.isvalid) this.isvalid=validate_textfield_maxlen(this,9,true,true);if (!this.isvalid) { selectAndFocusField(this);}return this.isvalid;" class="input" maxlength="9"></span>
</div>
<div class="field hidden"><input type="hidden" id="email" name="email" value="[email protected]"></div>
<div class="field"><label class="submit" for="submitbutton"><span class="required">*</span> Indicates required fields.</label></div>
<input type="submit" id="submitbutton" value="submit">
<!-- REQUIRED HIDDEN FIELDS FOR HTML ONLINE FORM -->
<input type="hidden" value="659197" name="compid"><input type="hidden" value="56" name="formid"><input type="hidden" value="" name="id"><input type="hidden" value="9b260d2f9bca0fd9c300" name="h"><input type="hidden" value="-1" name="rectype"><input type="hidden" value="" name="nlapiPI"><input type="hidden" value="" name="nlapiSR"><input type="hidden" value="ShipValidateField" name="nlapiVF"><input type="hidden" value="" name="nlapiFC"><input type="hidden" value="/app/site/crm/externalleadpage.nl?compid=659197&formid=56&h=9b260d2f9bca0fd9c300&[email protected]&firstname=Test&lastname=Account&ck=Q1BnzaRXAe_RfjhE&vid=Q1BnzaRXAd3Rfik7&cktime=87919&cart=5257&promocode=SAMPLE&chrole=1014&cjsid=0a0102621f435ef0d0d4b3cd49ab8b2db4e253c671eb" name="whence"><input type="hidden" name="submitted">
<iframe height="0" style="visibility: hidden;" name="server_commands" id="server_commands" src="javascript:false"></iframe>
<!-- END OF REQUIRED HIDDEN FIELDS FOR HTML ONLINE FORM -->
</form>
