发布表单数据控制器与阿贾克斯行动(Post form data to Controller'

2019-06-23 23:16发布

我有一个页面在MVC3,与链接(Ajax.ActionLink)。 当用户点击它,它会调用控制器的动作,结果被插入一个div,将其替换。

代码如下所示:

@Ajax.ImageActionLink("/Images/btn_share.png", "Share pool", "SharePool", new { poolKey = Model.Id, poolName = Model.Name },
    new AjaxOptions { 
        UpdateTargetId="popup", 
        HttpMethod="GET", 
        InsertionMode = InsertionMode.Replace,
        LoadingElementId="loading_dialog",
        OnSuccess = "ShowPopup('#popup_share', true, true)"
    } 

ImageLinkAction是使用图片作为链接的自定义扩展方法,并ShowPopup是一个JavaScript函数,它显示了更新的股利(使它看起来像一个弹出)

现在插入到它创建弹出股利的标记代码包含一个形式如以下

<div>
@using (Html.BeginForm()) {

    @Html.HiddenFor(model => model.ID)

    <div class="editor-label">
        @Html.LabelFor(model => model.EmailAddress)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.EmailAddress)
        @Html.ValidationMessageFor(model => model.EmailAddress)
    </div>

    // ... other fields

    @Html.ValidationSummary(true)
    <p>
        <button type ="submit">Share</button>       
    </p>
}
</div>

问题是与表单的提交:提交按钮调用适当的行动,但与回传,引起我的页面刷新。 我需要的是与阿贾克斯发布的数据,接收响应,这是被插入到另一个局部视图

我试图取代Ajax.ActionLink提交按钮,如下

    @Ajax.ActionLink("Share", "Share",
        new Models.MyModel 
            {
                ID = Model.ID,
                EmailAddress = Model.EmailAddress
            },
        new AjaxOptions
            {
                UpdateTargetId="popup", 
                HttpMethod="POST", 
                InsertionMode = InsertionMode.Replace,
                LoadingElementId="loading_dialog",
                OnSuccess = "ShowPopup('#popup_share', true, true)"
            }

控制器的代码如下所示:

[HttpPost]
public ActionResult SharePool(MyModel model)
{
    // ...
    return PartialView("_MyPartialView", model)
}

问题是,在瞬间的Ajax ActionLink的呈现(加载形式时)存在Model.EmailAddress没有值,因此,在控制器我的POST操作仅接收ID参数。

我该如何处理呢? 理想情况下,我认为我应该补充

OnBegin = "PreparePostData()"

但自从我知道的JavaScript只是基本上,我不知道我怎样才能实现这一点。 我觉得这PreparePostData()应收集表单字段和准备对象routeValues参数,调用Ajax调用之前设置。

任何人都可以给我如何实现这一一些迹象?

还是在这个问题上任何其他更好的办法?

谢谢

Answer 1:

我建议你只写自己的AJAX使用jQuery调用。 这是更灵活的比MVC的助手呢

@Html.ActionLink("Share", "Share", new { }, new { id = "share" })

然后函数

$("#share").click(function (e) {
   e.preventDefault();
   //Show loading display here
   var form= $("#shareForm");
   $.ajax({
       url : '@Url.Action("Share")',
       data: form.serialize(),
       type: 'POST',
       success: function(data){
          //Show popup
          $("#popup").html(data);
       }
   });
});


Answer 2:

当你对同一个页面多种形式(想象y're显示/隐藏在要求的情况下),你需要#ID之前添加如下形式:

$("#share").click(function (e) {
   e.preventDefault();
   //Show loading display here

// Need to add Form before #id 
   var form= $("Form#share");

   $.ajax({
       url : '@Url.Action("Share")',
       data: form.serialize(),
       type: 'POST',
       success: function(data){
          //Show popup
          $("#popup").html(data);
       }
   });
);


文章来源: Post form data to Controller's action with Ajax