Dialog box do not show some fields in IE
Hi ALL,
I have written code to create dialog box and show some text and two input boxes inside it. My code is working fine in Firefox. But, in IE if I click on the "Login" link dialog box appears but the text and two input boxes do not appear.
Here is my code :
This line creates the "Login" link:
-----------------------------------
$("#options").empty().append('<li><a id="loginModalDialog_options" class="primaryNav" onclick="m.render.showLoginDialog();" title="Login"><span id="loginModalDialog_login" class="t">Login</span></a></li>');
This method is getting called when I click on "Login" :
-------------------------------------------------------
showLoginDialog: function(link) {
if (typeof(link) == 'undefined') {
$("#loginDialog").trigger("click", [""]);
} else {
$("#loginDialog").trigger("click", [link]);
}
}
This code is for the popup box :
---------------------------------
<div id="loginDialog" title="Login Dialog" style="display:none;"></div>
<script type="text/javascript">
$("#loginDialog").click(function(event, link) {
var dialogContent = '<div class="right"><a class="button21 buttonGreyDarkIcon21sq buttonIcon21 unblockUI noProcess" href="#"><span><div class="icon21 deleteIcon21"> </div>Close</span></a></div>';
dialogContent = dialogContent + '<img src="/assets/images/logo_login_dialog.png">
';
dialogContent = dialogContent + '<div class="t" style="font-size:16px;">Login to <a href="http://me.memeo.com">me.memeo.com</a></div>
';
dialogContent = dialogContent + '<input type="text" id="email" name="email" title="Email" style="width:200px;"/>
';
dialogContent = dialogContent + '<input type="password" id="password" name="password" title="Password" style="width:200px;"/>
';
dialogContent = dialogContent + '<a class="button25 buttonGreen25sq" id="loginSubmitInDialog" href="#"><span class="t">Login</span></a>
';
$("td.content").empty().append(dialogContent);
$("#email").val($.evalJSON($.cookie('saucy')).cookie.emailAddress);
$("#loginSubmitInDialog").click(function() {
var email = $.base64Encode($("#email").attr('value'));
var password = $.base64Encode($.md5($("#password").attr('value')));
if (link != undefined && link != '') {
if (link.indexOf('/') != 0) {
link = $.base64Encode('/'+link+'/');
} else if (link.indexOf('/') == 0) {
link = $.base64Encode(link);
}
} else {
link = $.base64Encode('/#account/overview/');
}
var lastParam = $.base64Encode('login');
location.href = 'login#login/' + email + ',' + password + ',' + link + ',' + lastParam + ',';
return false;
});
$.blockUI({
message: $('#popup'),
css: {
top: ($(window).height() - $('#popup').height()) /2 + 'px',
left: ($(window).width() - 400) /2 + 'px',
width: '400px',
backgroundColor: 'transparent'
}
});
return false;
});
</script>
In IE, "Login to <a href="http://me.memeo.com">me.memeo.com</a>" and two input boxes do not appear. Would anyone please help me to figure out what the problem is?
Any help will be very much appreciated.
Thanks,
ighosh
--