单击jquery确认按钮后，处理到mvc操作

process to mvc action after jquery confirmation button is clicked

本文关键字：处理 mvc 操作 jquery 确认 按钮 单击      更新时间：2023-09-26

我正在尝试将jquery onclick confirmation对话框实现为我的mvc3删除操作。值得一提的是我很成功。渲染对话框本身，我正在努力的是在单击continue按钮后从js处理/User/Delete操作。这是代码：

onclick-delete.js
$(function () {
    var deleteLinkObj;
    // delete Link
    $('.delete').click(function () {
        deleteLinkObj = $(this);  //for future use
        $('#delete-dialog').dialog('open');
        return false; // prevents the default behaviour
    });
    //definition of the delete dialog.
    $('#delete-dialog').dialog({
        autoOpen: false, width: 400, resizable: false, modal: true, //Dialog options
        buttons: {
            "Continue": function () {
                $.post(deleteLinkObj[0].href, function (data) {  //Post to action
                    // THIS IS WHERE I SHOULD SEND DATA TO MY DELETE ACTION (Users/Delete)
                    else {
                        alert("error");
                    }
                });
                $(this).dialog("close");
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });
});

所以，我做错了什么。点击错误抛出后，任何想法

如果我错了，请纠正我，但这种方法不是更简单、更有效吗

@Html.ActionLink("Delete", "Delete", 
   new { id = item.Id }, 
   new { onclick = "return confirm('Are you sure you wish to delete this article?');" })

根据Mark Oreta回答中的讨论，我会做以下事情：

如果你像往常一样设置表单，你仍然可以从用户那里获得确认，而不会有太多麻烦。采用以下HTML/JS:

<form action="/User/Delete" method="post">
    <!-- some fields here -->
    <input id="btnSubmit" type="submit" value="Delete" />
</form>

这应该正确地将表单提交到后端。值得注意的是，如果您单击提交按钮，则在提交表单之前，将执行在javascript/jQuery中设置的任何单击事件。

所以你可以做：

$("#btnSubmit").click(function(event) {
    event.preventDefault(); // --> This stops the form submit from happening.
});

如果您只需要一个用户确认的文本框，那么就不需要使用标准confirm()函数以外的任何东西。这会向用户发送消息，并要求他同意或取消。函数根据用户的响应返回true/false。

所以你可以写最简单的代码：

$("#btnSubmit").click(function(event) {
    var confirmationmessage = "Are you sure you want to delete this?";
    if( ! confirm(confirmationmessage) ) {
        // !confirm == the user did not confirm. Therefore stop the form submission.
        event.preventDefault(); // --> This stops the form submit from happening.
    } else {
        // The user agreed. There is no else block needed, then normal form submission may occur.
    }
});

这段代码比问题中的代码段简单易读得多。当然，如果你更喜欢使用任何其他方式向用户询问确认，这也很有效。只需确保最后有一个if(someboolean) { event.preventDefault(); }即可。

我在这里为您创建了一个JSfiddle

我希望你拿出一些相关的代码，因为你的帖子功能设置不正确。我是这样工作的：

$(function () {
    var deleteLinkObj;
    // delete Link
    $('.delete').click(function () {
        deleteLinkObj = $(this);  //for future use
        $('#delete-dialog').dialog('open');
        return false; // prevents the default behaviour
    });
    //definition of the delete dialog.
    $('#delete-dialog').dialog({
        autoOpen: false, width: 400, resizable: false, modal: true, //Dialog options
        buttons: {
            "Continue": function () {
              $.post(deleteLinkObj[0].href, function (data) { 
                  //do the data parsing here      
                  alert(data);     
                    });
                $(this).dialog("close");
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });
});​

您在这里看到的数据解析是您需要处理控制器返回的内容的地方。通常，当我做这样的事情时，我从控制器上的删除操作返回的是一个布尔值，所以在上面的Jquery中，你可以做类似的事情

if (data == true)
alert("success!");
else
alert("error");

试试这个：

<script type="text/javascript">
    $(document).ready(function () {
        $('form[action$="/Delete"]').submit(function () {
            return confirm('Are you sure you want to delete ?');
        });
    }); 
</script>

使用jQuery事件，您只需考虑这些。。http://api.jquery.com/submit/

相关文章：