MVC Ajax.BeginForm JavaScript参数

时间:2016-07-16 22:13:44

标签: javascript jquery ajax asp.net-mvc razor

我有一个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;
}

剃刀:

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

控制器:

public ActionResult Add(int ArticleID, Comment model)
{

}

如何将JavaScript函数结果用作BeginForm参数?

1 个答案:

答案 0 :(得分:3)

@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);
     });
  });

});