javascript - MVC Ajax.BeginForm JavaScript 参数

Question

我有一个 AJAX 表单，其中 url id 需要来自 JavaScript

@using(Ajax.BeginForm("Add","Comments", new { ArticleID = 3 }, new AjaxOptions { UpdateTargetId="Comments"}))

应替换其中的 ArticleID = 3，以便将 ArticleID 值设置为等于调用的 Javascript 函数的结果。类似的东西

JS:

function GetArticleID()
{
      return 3;
}

Razor :

@using(Ajax.BeginForm("Add","Comments", new { ArticleID = GetArticleID() }, new AjaxOptions { UpdateTargetId="Comments"}))

Controller :

public ActionResult Add(int ArticleID, Comment model)
{

}

如何使用 JavaScript 函数结果作为 BeginForm 参数？

Answer 1

行 @using(Ajax.BeginForm(") 将由服务器上的 razor 执行。当时它不了解客户端浏览器中的 javascript 方法。所以你不能混合使用那里有一个 JavaScript 函数。

我更喜欢编写干净的自定义代码来执行 ajax 表单提交(而不是使用 Ajax.BeginForm)，因为它允许我以我想要的任何方式进行自定义。

保持您的表单为正常表单。

@using(Html.BeginForm("Add","Comments"))
{
   <input type="hidden" name="ArticleId" id="ArticleId" value=""/>
   <input name="CommentText" type="text" />
   <input type="submit" id="saveCmntBtn" />
}

现在监听提交按钮的click 事件。将 ArticleId 值分配给输入字段，获取表单的序列化版本并发布到服务器。您可以使用 jQuery serialize() 方法来获取表单的序列化版本。

$(function(){

  $("#saveCmntBtn").click(function(e){
     e.preventDefault();
     $("#ArticleId").val(GetArticleID());
     var f=$(this).closest("form");
     $.post(f.attr("action"),f.serialize(),function(res){
       $("#Comments").append(res);
     });
  });

});