JQuery Dialog that calls remote script via ajax
I'm trying to get JQuery's dialog to send data to a remote script whenever the 'Add' Button is clicked in the dialog button, but my script seems to die at the .ajax and nothing is showing up in my console to give me a clue as to the error:
$( "#button" ).dialog({
resizable: false,
title: "Confirm",
height:140,
modal: true,
autoOpen: false,
buttons: {
"Add": function() {
var data = $('.part1').serialize()
$.ajax({
url: "/www/htdocs/test.pl",
type: "GET",
data: data,
cache: false,
success: functi开发者_开发问答on {
$('#div1').fadeOut('slow');
$('#div2').fadeIn('slow');
}
});
return false;
},
Cancel: function() {
$(this).dialog( "close" );
}
}
});
<div id="div1">
<input class="part1" type="hidden" value="Jon" name="fname">
<input class="part1" type="hidden" value="Doe" name="lname">
<input class="part1" type="hidden" value="jon@doe.com" name="email">
<input id="button" type="button" value="button">
</div>
<div id="div2">Complete</div>
You got a few syntax errors (which do show up in FireBug):
Add ;
at the end of:
var data = $('.part1').serialize()
like:
var data = $('.part1').serialize();
Add ()
after success: function
like:
success: function()
Making the full code like this:
$( "#button" ).dialog({
resizable: false,
title: "Confirm",
height:140,
modal: true,
autoOpen: false,
buttons: {
"Add": function() {
var data = $('.part1').serialize();
$.ajax({
url: "/www/htdocs/test.pl",
type: "GET",
data: data,
cache: false,
success: function()
{
$('#div1').fadeOut('slow');
$('#div2').fadeIn('slow');
}
});
return false;
},
Cancel: function() {
$(this).dialog( "close" );
}
}
});
with those fixes, working fine here: http://jsfiddle.net/YzhG9/10/
精彩评论