如何在javascript函数中获取Model值并将其传递给控制器​​？

Question

我的CSHTML页面上有一个模型，我用这种方式：

@model Web.Models.Element

@using (Html.BeginForm("Search", "Company"))
{
@Html.HiddenFor(c => c.Person)

<div class="panel panel-default">
    <div class="panel-heading"> Company Search</div>
    <div class="panel-body collapse" id="screenCompanySearch">
        <form id="formSearch" name="formSearch" method="post">
            <fieldset style="margin: 20px;">
                <legend>Search</legend>

                <div class="row">
                    <div class="col-xs-2 col-sm-2">
                        @Html.Label("Company Name")
                        @Html.TextBoxFor(c => c.Company.Name, new { @class = "form-control" })
                    </div>
           </fieldset>
        </form>
    </div>
</div>

通过按钮点击这个方式来调用我的Javascript函数：

$("#btnSearch").on("click", function() { searchCompany(); })'

在我的JavaScript函数中，我需要使用TextBoxFor值完全加载此模型：

<script type="text/javascript">
function searchCompany() {
   var data = $("#formSearch").serialize();
    $.ajax({
        url: "@(Url.Action("SearchCompany", "Company"))",
        cache: false,
        data: data,
        type: "POST",
        success: alert("sucesso!")
    });
}
</script>

正在正确加载我的Controller方法，但是传入Ajax“data”参数的模型没有填充TextBoxFor值。

这是我对视图的控制器ActionResult：

public ActionResult Consulta()
    {
        Element model = new Element();
        model.Person = new Person();

        return View(model);
    }

发生的事情是我的模型在我的控制器上实例化，但TextBoxFor的值没有记录在模型的属性上。

我该如何解决这个问题？谢谢你。

已更新

<div class="col-xs-2 col-sm-2">
     @Html.Label("Person Name")
     @Html.TextBoxFor(c => c.Person.Name, new { @class = "form-control" })
</div>

所以，'c'等于我的Element对象。当我到达Controller方法“Search”时，通过ajax调用传递的参数Element不会实例化Element.Person，它会给我Person = null。

在我的ActionResult中我有：

Element model = new Element();
model.Person = new Person();

元素类：

public Element()
{
    this.Contacts = new List<Contact>();
    this.DataType = new DataType();

}

public int ID_Element { get; set; }
public int ID_ElementType { get; set; }

public virtual List<Contact> Contacts { get; set; }
public virtual DataType DataType { get; set; }
public virtual Person Person {get; set; }

控制器操作

[HttpPost]
public JsonResult SearchCompany(Element model)
{
    ...
}

Answer 1

serialize方法没有提供表单的序列化版本，因为您有嵌套的表单标记。

{{1}}将创建一个外部表单标记，并在其中包含您的另一个表单，从而创建一个嵌套的表单结构。嵌套表单无效。您可以在同一页面中拥有2个表单，彼此平行，而不是嵌套。

如果您修复了嵌套表单问题，serialize方法将为您提供有效的字符串表单输入。

{{1}}

请记住，serialize方法将为您提供此特定表单中项目的输入元素值。如果您想发送一些其他数据（例如：Id），您需要将其保留在此表单内的输入字段中。