Asp.net mvc 3 通过jquery在asp.net mvc中传递强类型表单模型数据

在控制器中，将表单提交到具有强类型文本框（例如，带有提交按钮）的操作方法是很容易的，但是如果我想通过jquery发送与强类型文本框完全相同的表单（可能是在单击其他内容后的$.ajax调用），该怎么办呢

代码如下：

 @Html.TextBoxFor(m => m.topTenFav.YoutubeLink,new { id="youTubeLinkTxt"})

为我们完成所有工作，在控制器中映射对象的属性非常简单

 [HttpPost]
 public ActionResult AddTopTenFav(HomeViewModel topTen)
 {
     topTen.topTenFav.Date = DateTime.Now;
     topTen.topTenFav.UserName = User.Identity.Name;
     repository.AddTopTen(topTen);
     repository.Save();
     return RedirectToAction("Index");
 } 

如何将此表单发送到控制器，在单击事件（例如）时将表单中的文本框映射到对象的属性

 $("#btnAddGenre").click(function () {}

 @using (Html.BeginForm(
        "AddTopTenFav", "Home", FormMethod.Post, new { id = "AddTopTenFavForm" }))
 {

    <span id="youTubeLinkSpan">Youtube Link</span>
    <div>
        @Html.TextBoxFor(m => m.topTenFav.YoutubeLink,new { id="youTubeLinkTxt"})
    </div>
    <span id="youTubeNameSpan">Song Title</span>
    <div>
        @Html.TextBoxFor(m => m.topTenFav.Title,new { id="youTubeNameTxt"})
    </div>

    <button type="submit" name="btnSubmit" value="">submit</button>
 }

$（“#btnAddGenre”）。单击（函数（）{}
@使用（Html.begin）(
“AddTopTenFav”，“Home”，FormMethod.Post，新的{id=“AddTopTenFavForm”}）
{
Youtube链接
@TextBoxFor（m=>m.topTenFav.YoutubeLink，新的{id=“youTubeLinkTxt”}）
歌曲名称
@Html.TextBoxFor（m=>m.topTenFav.Title，新的{id=“youTubeNameTxt”}）
提交
}

您可以执行以下操作：

$(document).ready(function(){
    $('#btnAddGenre').click(function () {
        $.post(
            $('#AddTopTenFavForm').attr('action'),
            $('#AddTopTenFavForm').serialize,
            function (data) {
                window.location = @Url.Action("Index");
            },
            'html' // returned data type
        );
    });
});

我使用html数据类型，因此您可以返回所需的任何内容，并使用

@Url.Action

提供位置，在

窗口.location

上进行重定向

---

如果成功，请标记为接受答案

是，您可以使用jquery发布强类型textboxex的数据。 首先你要做的是 使用下面的代码获取jquery中所有textboxex的值

            var xx= $("#xx").val();

这将从mvc文本框中给出xx中的val。 然后，通过使用jqueryajax调用，您可以调用action方法。 代码如下

$.get("/XXXX/YY/1", { xxName: xx }, function (data) {
                    var status = data;
                    alert(status);
                    if (status) {
                        return true;
                    }
                    else {
                        alert("The book with this name is already present. TRY DIFFERENT NAME!")
                        return false;
                    }
                });

这里xxxx是控制器，yy是操作方法名称。下一个参数是您要作为参数发送的所有文本框的值。 这将执行ajax调用并返回值

---

如果您发现任何问题，请告诉我，我将给出完整的代码。

您将javascript放在视图中。我做了一点更改。请重试并告诉我发生了什么。为什么您将表单放在一个匿名函数中，该函数会在点击事件中触发？在更详细地查看代码后，我注意到您刚刚忘记关闭e click函数，关于能够进行ajax调用，asp.net mvc有一个助手ajax.BeginForm，这样你可以使用内置的支持，如果你愿意的话。很好的解决方案。你假设他从控制器返回true，并手动创建你想通过get请求传递的所有参数。不，我假设他正在工作MVC3和razor，然后我认为他可以理解他需要获取或发布什么。因此他可以根据自己的要求进行操作。因为我复制并粘贴了jquery代码，所以我错误地忘记了将其更改为post。对于参数，您可以在jquery中获取参数，并可以使用此过程轻松地在post方法中发送值。您可以尝试这个方法非常简单，谢谢你提醒我我的错误，谢谢你没有回答，但这对我来说并不起作用。我找到了一个解决mz问题的有效方法$.post（“/Home/AddTopTenFav”，$（“#AddTopTenFavForm”）.serialize（），函数（json）{//handle response}，“json”）；