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

时间:2011-04-15 21:37:43

标签: javascript jquery jquery-ui

工作流程: 用户单击该按钮,将打开一个带有搜索表单的对话框。 ajax post请求被发送到服务器,并获得json响应。我得到了成功处理程序的回调。现在有两个问题。

  1. 成功回调(successFn)后对话框关闭。我在成功回调中得到了json响应,我希望用户看到结果,然后按关闭按钮终止对话框。

    1. 对话框关闭后不久,会向服务器发送get请求。关闭对话框后,网址就像http://localhost:8080/search?query=。我没有明确发送任何GET请求
    2.  

                                               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
          });
      });     
      

2 个答案:

答案 0 :(得分:1)

最好在表单中添加method="post",以避免发送任何意外的GET数据。

添加return false;成功功能可能会停止对话框的关闭。如果可以,我会测试一下。

修改:还要检查所有代码是否在jQuery(document).ready( function(){

希望有所帮助!

答案 1 :(得分:1)

我认为你只需要添加return false

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