Hello I am using colorbox and jquery form (http://colorpowered.com/colorbox/) I am simply stuck on what do next. I am trying to use jquery colorbox to unhide a DIV to show password box in the colorbox. I took out some of the relevant scripts to make the code more readable and increase my chance of receiving help.
This is the javascript in the header I use:
<script type="text/javascript">
$(document).ready(function(){
$('#password_reset').ajaxForm({
success: showResponse,
clearForm: 'true'
});
function showResponse(responseText, statusText) {
$('#password_reset').hide();
$('#formStatus').html(responseText);
};
$().bind('cbox_open', function(){
$('#password_reset').show();
$('#formStatus').html('');
});
$(".inline").colorbox({width:"300px", height:"250px", inline:true,
href:"#password_change"});
});
</script>
This is the link I have that is supposed to run my javascript code (above) and unhide the div below and run it into colorbox:
<a href="javascript:showResponse">Password Reset</a>
This is my hidden div:
<div style="visibility: hidden;">
<div id='password_change' style="padding:10px; background:#fff;">
<strong>Change your password</strong><br /><br />
<form id="password_reset" acti开发者_高级运维on="password_reset.php" method="post">
<input type="hidden" name="Method" value="updatePassword" />
Password: <br />
<input type="password" name="password1" />
<br />
<br />
Verify Password: <br />
<input type="password" name="password2" />
<br />
<input type="submit" value="Update" />
</form>
<div id="formStatus"></div>
</div>
</div>
</body>
</html>
Hopefully someone can tell me how I can get this working as I am completely stuck.
Modified script as:
<script type="text/javascript">
$(document).ready(function(){
$('#password_reset').ajaxForm({
target: '#formStatus',
success: showResponse,
clearForm: 'true'
});
$(".inline").colorbox({
width:"300px",
height:"250px",
inline:true,
href:"#password_change"
});
});
function showResponse(responseText, statusText) {
$.fn.colorbox.close();
}
</script>
No need to bind cbox_open
and replace:
<a href="javascript:showResponse">Password Reset</a>
with:
<a class="inline" href="#">Password Reset</a>
精彩评论