Question

我显然错过了一些东西，但不能为我的生活看到它是什么如果有人能指出我的错误会很感激。

我有一个简单的详细信息页面，其中包含一个表单，用于为所选详细信息添加注释。

我有一个视图，其中包含以下内容：

@using (Html.BeginForm("Details", "Home", FormMethod.Post, new { id ="commentForm" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <div class="form-group">
        @Html.LabelFor(model => model.NewComment.Name);
        @Html.TextBoxFor(model => model.NewComment.Name, new { @class = "form-control" })
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.NewComment.Body);
        @Html.TextAreaFor(model => model.NewComment.Body, new { @class = "form-control" })
    </div>

    <input type="submit" class="btn btn-primary" value="Add Comment" />
}

然后，该视图调用以下c＃控制器方法：

        [HttpPost]
        public ActionResult Details(int id,DetailsViewModel model)
        {

            if (!ModelState.IsValid)
                return View(model);

            var content =_data.First(c => c.Id == id);

            content.Comments.Add(model.NewComment);

            return View(new DetailsViewModel(content));
        }

如果我使用表单而不添加任何其他代码来使用jquery捕获提交，那么这一切都能正常工作。

当我将以下JQuery代码添加到页面时，上面的服务器代码没有被执行（我知道我实际上并没有在上面的方法中返回任何json，但是如果该方法没有执行，现在看起来多余了？）：

    $(document).ready(function () {

        $("#commentForm").submit(function (event) {
            event.preventDefault();

            var url = $(this).attr('action');

            $.getJSON(url, $(this).serialize(), function (comment) {
                alert(comment)
            });
        });
    });

如果还值得注意的是，如果我在getjson调用周围添加任何警报，那么这些都会正确启动。

有没有人对我做错了什么有任何想法？

Answer 1

尝试发布到控制器。

$ .getJSON正在执行http get。您的控制器端点期待一个帖子，并且不接受http get。

这是一个提供相同功能的函数（blog reference）：

(function ($) {

    $.postJSON = function (url, data) {

        var o = {
            url: url,
            type: "POST",
            dataType: "json",
            contentType: 'application/json; charset=utf-8'
        };

        if (data !== undefined) {
            o.data = JSON.stringify(data);
        }

        return $.ajax(o);
    };

} (jQuery));

只需在jQuery包含后将其添加到某处。

Answer 2

当您使用.getJSON时，它会发出GET请求，而您的Details方法只会回复POST请求。

请改为尝试：

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

Answer 3

当您使用$.post()：http://api.jquery.com/jQuery.post/

时，请使用FormMethod.Post

使用$ .getJson方法从jquery调用c＃mvc控制器方法

3 个答案: