1

当用户点击超链接时，我想运行一个后台进程。在我运行之前，我想使用 jQuery 对话框（表单）询问用户的许可。当用户在表单上单击“确定”时，我想使用 jQuery ajax 运行该操作。如果过程失败，那么我想用“错误”更新那个弹出窗口。如何使用 jQuery AJAX 在 asp.net MVC 中执行此操作。下面是我试过的代码

这是我的 MVC Ajax 开始表单代码

@using (Ajax.BeginForm("Action1", "Controller1", new AjaxOptions { UpdateTargetId = "eProcess" }, new { id = "eProcess" }))
{
    @Html.Hidden("eID", eId);                                                                                  
    @Html.Hidden("processName", "processName");                                                                                                                                                
    <div class="hide" id="dialog" title="Confirmation Required">
        Are you sure you want to update this record? <br />                       
        <input type="button" value="Hit" id="btnHit" />                    
    </div>    
}

下面是我的对话框代码

$("#dialog").dialog
({
    dialogClass: "ee-detail-info",
    closeOnEscape: false,
    height: 200,
    width: 300,
    modal: true,
    autoOpen: false,
    open: function (event, ui) {

        $("#btnHit").click(function () {

            $('#processName')[0].value = processName;
            document.forms.eProcess.submit();  

        });
        }

});

我什至尝试使用 .ajax 方法，但它仍然在做完整的回发。我仔细检查了我的 jQuery 文件。它们在页面上正确链接。

$("#eProcess")[0].submit(function () {
    $.ajax({
        url: $("#eProcess")[0].action,
        success: function (res) {
            alert("Success");
        }
    });
});

更新

我让它与您的解决方案一起使用。我的代码中有错误。

4

1 回答 1

2

我仔细检查了我的 jQuery 文件。它们在页面上正确链接。

确保jquery.unobtrusive-ajax.js在 jquery 之后包含脚本。

如果是这种情况，您不需要手动订阅任何 .click 事件。只需离开Ajax.BeginForm即可发送 AJAX 请求。

如果你不想依赖Ajax.BeginForm然后简单地写一个正常的形式：

@using (Html.BeginForm("Action1", "Controller1", FormMethod.Post, new { id = "eProcess" }))
{
    @Html.Hidden("eID", eId);                                                                                  
    @Html.Hidden("processName", "processName");                                                                                                                                                
    <div class="hide" id="dialog" title="Confirmation Required">
        Are you sure you want to update this record? <br />                       
        <input type="button" value="Hit" id="btnHit" />                    
    </div>    
}

接着：

$(function() {
    $("#dialog").dialog({
        dialogClass: "ee-detail-info",
        closeOnEscape: false,
        height: 200,
        width: 300,
        modal: true,
        autoOpen: false
    });

    $('#dialog').on('submit', '#eProcess', function() {
        // here you could set the value of the the hidden field
        // if you wanted to pass some additional information
        // to the controller

        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {
                $('#eProcess').html(result);
            }
        });
        return false;
    }); 
});
于 2013-07-20T09:32:46.133 回答