使用AJAX時表單數據未發布到控制器

Question

好的，因此我認為該表格是：

<form id="MyForm">
<input type="text" name="myinput" />
<button type="submit" />
</form>

我的視圖頂部有以下Javascript，該Javascript在頁面加載時運行：

<script type="text/javascript">
    $(document).ready(
        function () {
            $("#MyForm").submit(
                function () {
                    var url = "Home/TestAjax";

                    var dataToSend = $("#MyForm").serialize();
                    alert(dataToSend);

                    $.ajax
                    (
                        {
                            type: "POST",
                            url: url,
                            data: dataToSend,
                            success: function (data) {
                                alert(data);
                            }
                        }
                    );

                    return false;
                }
            );
        }
    );
</script>

窗體已正確地序列化為ajax，如警告框所驗證。 這是我的TestAjax控制器方法：

[HttpPost]
public string TestAjax(string data)
{
    return !string.IsNullOrEmpty(data) ? "Success" : "Failure";
}

返回的值是“失敗”，因為沒有回發AJAX。 我在這里做錯了什么？

謝謝

Answer 1

輸入字段的名稱是myinput而不是data 。 因此，請確保您也一致地命名了操作的參數：

[HttpPost]
public ActionResult TestAjax(string myinput)
{
    return !string.IsNullOrEmpty(myinput) ? Content("Success") : Content("Failure");
}

當您使用$("#MyForm").serialize()將返回myinput=some_value ，其中some_value顯然是用戶在此輸入字段中輸入的值。

並且如果您的表單中有2個輸入字段：

<form id="MyForm">
    <input type="text" name="foo" />
    <input type="text" name="bar" />
    <button type="submit" />
</form>

您當然會編寫一個視圖模型：

public class MyViewModel
{
    public string Foo { get; set; }
    public string Bar { get; set; }
}

您的控制器動作將作為參數：

[HttpPost]
public ActionResult TestAjax(MyViewModel model)
{
    return !string.IsNullOrEmpty(model.Foo) ? Content("Success") : Content("Failure");
}

還請注意，在ASP.NET MVC控制器中，操作應返回ActionResults，而不是字符串或任何其他內容。