将表格序列化以发布回控制器方法时,我遇到一个奇怪的问题。传递的某些字段为空(对于字符串或可为空的值)或零(对于数字值)。例如,使用以下简单配置:

ViewModel:

public class HomeViewModel
{
    public int FakeId { get; set; }
    public string StringDataValue { get; set; }
    public int IntegerDataValue { get; set; }

    public HomeViewModel() { }

    public HomeViewModel(int fakeId)
    {
        FakeId = fakeId;
        StringDataValue = "This is some string data";
        IntegerDataValue = 42;
    }
}


控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        HomeViewModel viewModel = new HomeViewModel(15);
        return View(viewModel);
    }

    [HttpPost]
    public JsonResult PostData(HomeViewModel model)
    {
        return JsonResult
        {
            Data = new
            {
                FakeId = model.FakeId,
                StringData = model.StringDataValue,
                IntegerData = model.IntegerDataValue
            }
        };
    }
}


视图:

@model WebApplication1.Models.HomeViewModel

@{
    ViewBag.Title = "Home Page";
}

@using(Html.BeginForm())
{
    @Html.HiddenFor(m => m.FakeId)
    <div>
        Fake ID: @Html.DisplayFor(m => m.FakeId)
    </div>
    <div>
        String Data: @Html.TextBoxFor(m => m.StringDataValue)
    </div>
    <div>
        Integer Data: @Html.TextBoxFor(m => m.IntegerDataValue)
    </div>
    <button id="btnPost">Post</button>
}

@section scripts
{
    <script type="text/javascript">
        $(function () {
            $("#btnPost").on("click", function (e) {
                e.preventDefault();
                var model = $("form").serialize();
                console.log(model);
                $.post("PostData", JSON.stringify(model))
                    .success(function (d) {
                        console.log(d);
                    })
                    .error(function () {
                        console.log("error");
                    })
            })
        })
    </script>
}


如果单击“发布”按钮,则会得到以下两个console.log()行的输出:

console.log(模型):FakeId=15&StringDataValue=This+is+some+string+data&IntegerDataValue=42
console.log(d):
Object {FakeId: 0, StringData: "This is some string data", IntegerData: 0}

如您所见,只有StringDataValue实际到达了控制器。但是,如果我在Model.FakeId隐藏字段上方的视图中添加@Html.Hidden("dummy"),则会得到以下输出:

console.log(模型):
dummy=&FakeId=15&StringDataValue=This+is+some+string+data&IntegerDataValue=42
console.log(d):
Object {FakeId: 15, StringData: "This is some string data", IntegerData: 0}

更好一点,但是IntegerDataValue仍然没有到达控制器。但是,如果在视图中显示Model.IntegerDataValue的位置之后添加@Html.Hidden("dummy2"),则会得到以下输出:

console.log(模型):
dummy=&FakeId=15&StringDataValue=This+is+some+string+data&IntegerDataValue=42&dummy2=
console.log(d):
Object {FakeId: 15, StringData: "This is some string data", IntegerData: 42}

现在,我所有的视图模型值都已正确传递到控制器。我只是不明白为什么我必须放入虚拟字段才能实现它。我花了很长时间才弄清楚为什么在控制器方法中获得不完整的数据,直到我意识到发生了什么。

只有我吗?其他人可以复制这种行为吗?我想念什么吗?

最佳答案

取出JSON.stringify并尝试。所以像

 <script type="text/javascript">
        $(function () {
            $("#btnPost").click(function(e) {
                e.preventDefault();
                var model = $("form").serialize();
                console.log(model);
                $.post("Home/PostData", model)
                    .success(function(d) {
                        console.log(d);
                    })
                    .error(function() {
                        console.log("error");
                    });
            });
        });
    </script>

关于c# - jQuery .serialize()问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24335537/

10-13 08:31