jQuery对话框：如何防止关闭对话框+额外的获取请求！

Question

The work flow: user click the button, a dialog box opens with a search form. An ajax post request is sent to the server, and get a json response. I get the callback on success handler. Now two issues.

1. the dialog closes upon success callback (successFn). I get the json response in the success call back, and I want the user to see the result and press close button to terminate the dialog,.

   1. Soon after the dialog closes, a get request is sent to server. After closing the dialog by itself, the url is like http://localhost:8080/search?query= . I do not send any GET request explicitly
   jQuery(document).ready( function(){ jQuery("#myButton").click( showDialog );

     $myWindow = jQuery('#myDiv'); $myWindow.dialog({ width: 400, autoOpen:false, title:'Hello World', overlay: { opacity: 0.5, background: 'black'}, modal: true, /*open: function (type, data) { // include modal into form $(this).parent().appendTo($("form:first")); }, */ buttons: { "Submit Form": function() { $('form#myform').submit();}, "Cancel": function() {$(this).dialog("close");} } }); }); var showDialog = function() { $myWindow.show(); $myWindow.dialog("open"); } var closeDialog = function() { $myWindow.dialog("close"); } var successFn = function (response) { var obj = JSON.parse(response); $("#result").html('').html(obj.name); } var errorFn = function (xhr, ajaxOptions, thrownError){ $("#myform").parent().html('').html(xhr.statusText); } var query = $("input#query").val(); var dataString = 'query='+ query ; $('form#myform').submit(function(){ $.ajax({ type: 'post', dataType: 'json', url: '/search', async: false, data: $("#myform").serialize(), success: successFn, error: errorFn }); }); 

Answer 1

It would be a good idea to add method="post" to your form to avoid any accidental GET data being sent.

Adding return false; to the success function may stop the dialog from closing. I'll test this if I can.

Edit: also check that all your code is inside jQuery(document).ready( function(){

Hope that helps!

Answer 2

我想你只需要添加return false 。

"Submit Form": function() { $('form#myform').submit(); return false;},