FYI: jqModal website: http://dev.iceburg.net/jquery/jqModal/
Similar system to thickbox but lighterweight
New problem though.
submit button presses are NOT detected when the jqmodal page is loaded via
AJAX. ie. instead of putting the contents of the login etc on the page, i
put it in a login.htm page and target that when calling.
I put in 2 login boxes in the code to show you that one works & the other
doesnt. One Inline (the code for box contents is in the same page but hidden
till launched) & AJAX (the desired way, code for box is held in external
file & linked to)
Problem is, the externally linked login box even though EXACT same code as
inline, when attempting to submit via the submit button, the associated
function in document ready is not launched. So basically when launching the
external AJAX requested login page, the submit button in it no longer works.
So is there an alternative to this? Maybe a different way of submit button
click detection or something like that? I'm just guessing that because the
login button is called through an ajax call & not initially on the page when
it loads, that it is thus not detected when clicked??? I dont know just a
guess
Heres my code:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jqModal.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#inline').jqm(); // INLINE ~ BUTTON CLICK DETECTED
$('#loginBox').jqm({ajax: 'login.htm', trigger: 'a.openLogin'}); //
EXTERNAL FILE, BUTTON CLICK UNDETECTED
$('.loginBtn').click(function(){
$("#status").text('hi'); //DEBUG TEST to check for
button click detection
~ & IT FAILED
myusername = $('[EMAIL PROTECTED]').get(0).value;
mypassword = $('[EMAIL PROTECTED]').get(0).value;
$.ajax({
url: "process.php",
type: "POST",
data: $.param( {user:myusername,pass:mypassword} ),
success: function(msg){
if (msg == 1) { $("#status").text('Successful
Login');
setTimeout(function(){$(".jqmClose").click();},1000);
} else { $("#status").text('Failed Login'); }
}
});
});
});
</script>
<link rel="stylesheet" href="jqModal.css" type="text/css" />
</head>
<body>
# Login
# Inline
<br>
<div class="jqmWindow" id="inline">
<h2> # Close Customer Login</h2>
<input type="text" name="username" size="15" style="float:
right;"/>Email:<br />
<input type="password" name="password" size="15" style="float:
right;"/>Password: <br />
<input type="submit" value="Login" class="loginBtn" />
<div id="status">Stat</div>
</div>
======== THIS IS THE INLINE ONE ========
<div class="jqmWindow" id="inline">
<h2> # Close Customer Login</h2>
<input type="text" name="username" size="15" style="float:
right;"/>Email:<br />
<input type="password" name="password" size="15" style="float:
right;"/>Password: <br />
<input type="submit" value="Login" class="loginBtn" />
<div id="status">Stat</div>
</div>
====== THE AJAX ONE IS PLACED WITHIN THIS DIV TAG, EXACT SAME CODE AS
CONTENTS OF DIV ABOVE ==
<div class="jqmWindow" id="loginBox">
Please wait Loading Login Page... images/loading.gif
</div>
--
View this message in context:
http://www.nabble.com/jqModal%3A-closeClass-and-href--tf3245957.html#a9038269
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
