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

jQuery dialog: how to prevent closing the dialog + an extra get request!

本文关键字：对话框 get 请求 何防止 jQuery      更新时间：2023-09-26

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

  1. 对话框在成功回调(successFn)时关闭。我在成功回调中获得json响应，我希望用户看到结果并按下关闭按钮以终止对话框，

      在对话框关闭后不久，一个get请求被发送到服务器。关闭对话框后，url类似于http://localhost:8080/search?query=。我没有显式地发送任何GET请求

jQuery(文档)。准备好(函数(){jQuery("#色")。点击(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
    });
});

将method="post"添加到表单中以避免意外发送GET数据是一个好主意。

添加返回false;成功函数可以阻止对话框关闭。如果可以的话，我将测试一下。

编辑:也检查你所有的代码是在jQuery(document).ready( function(){

希望有帮助!

我认为你只需要添加return false。

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