使用ajax修改表单,使用Ajax将表单数据发布到Controller的操作

卫嘉言
2023-12-01

我在MVC3中有一个页面,带有链接(Ajax.ActionLink)。当用户单击它时,它将调用控制器的动作,并将结果插入到div中,并带有replace。

代码如下所示:

@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是显示更新后的div(使其显示为弹出窗口)的javascript函数。

现在,插入到创建弹出窗口的div中的标记代码包含如下形式

@using (Html.BeginForm()) {

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

@Html.LabelFor(model => model.EmailAddress)

@Html.EditorFor(model => model.EmailAddress)

@Html.ValidationMessageFor(model => model.EmailAddress)

// ... other fields

@Html.ValidationSummary(true)

Share

}

问题出在表单的提交:“提交”按钮调用适当的操作,但带有回发,这会导致页面刷新。我需要用ajax发布数据,接收响应,这是另一个插入到

我试图用下面的Ajax.ActionLink替换Submit按钮

@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()应该收集表单字段并准备在调用ajax调用之前设置的对象routeValues参数。

任何人都可以给我一些有关如何执行此操作的指示?

还是在这个问题上有其他更好的方法?

谢谢

 类似资料: