在ASP.. NET中，一个POST/Redirect/GET序列带AJAX击中重定向到操作两次

Question

在视图中，我有以下内容:

@using (Html.BeginForm())
{    
    <input type="submit" id="savebtn" value="Save" onclick="saveLayout()"/>
}
<script type="text/javascript">
    function saveLayout() {
        $.ajax({
            url: '/Page/SaveFaces/',
            data: {
               /* layout data of the page, irrelevant */
            },
            type: 'post',
            success: function () {                
            }
        });
        return false;
    }
</script>

上面的代码执行以下操作，简单地将用户重定向到他们来自的URL(它也应该保存数据，但为了简单起见，我删除了这一部分，因为它不影响问题):

[HttpPost]
public ActionResult SaveFaces(string items)
{
    return Redirect(Request.UrlReferrer.AbsoluteUri);
}

然后，由于重定向，我们回到这个非常标准的模型获取操作:

public ActionResult Index(int id = 0)
{
    var page = db.Pages.Find(id);
    if (page == null) return HttpNotFound();
    return View(page);
}

问题是最后一个动作被调用了两次。

我已经尝试删除AJAX调用并进行正常的POST操作，问题就消失了。然而，我试图发送的数据只能通过jQuery脚本获得，我不能把它们放在表单中。我只能使用AJAX方法。

我能做些什么来防止动作被击中两次吗?

Answer 1

我看你用的是jQuery。你能试试这个吗?(注意，您可能必须绑定form提交事件而不是输入按钮，或者两者都绑定)

@using (Html.BeginForm())
{    
    <input type="submit" id="savebtn" value="Save" >
}
<script type="text/javascript">
    $("#savebtn").submit(function saveLayout(event) {
        // The magic that prevents post.
        event.preventDefault();
        $.ajax({
            url: '/Page/SaveFaces/',
            data: {
               /* layout data of the page, irrelevant */
            },
            type: 'post',
            success: function () {                
            }
        });
        return false;
    }
</script>

如果你可以访问form元素，另一种方法是:

<form onsubmit="javascript: return false;">

Answer 2

虽然这可能有点特定于我的场景，但我只是找到了一个可接受的解决方案。由于所有数据都是通过jQuery提供的，所以我完全删除了表单，并用一个简单的链接替换了提交按钮。

那么，这个就消失了:

@using (Html.BeginForm())
{    
    <input type="submit" id="savebtn" value="Save" />
}

而这里是:

<a onclick="saveLayout()" id="saveLink">Click to save.</a>

现在[HttpPost]动作被击中，数据被保存，重定向动作也被击中，一次