Ajax無法將表單ID發送到MVC控制器

Question

我對ajax有一點問題。 首先，我將向您展示我的行為。

形成：

<form id="QuestionForm">
    @Html.TextBoxFor(model => model.Body, new { @class = "form-control", @placeholder = "Body" }) 
    @Html.TextBoxFor(model => model.Text, new { @class = "form-control", @placeholder = "Text" })
</form>

這是我的腳本和ajax代碼：

$("#btnSubmit").click(function () {
    var data = $('#QuestionForm').serialize();

    $.ajax({
        type: "POST",
        url: "/Survey/AddQuestion",
        data: {data, @Model.Survey.Id},
        success: function () {
            $("#AddQuestion").modal("hide");
            //alert("Survey Added");
            location.reload();
        }
    })

})

這是我的控制器動作：

public JsonResult AddQuestion(SurveyQuestion model, int id) 
{  
    SurveyQuestion question = new SurveyQuestion();
    question.Body = model.Body;
    question.CreatedOn = DateTime.Now;
    question.ModifiedOn = DateTime.Now;
    question.Priority = 0;
    question.SurveyId = id;
    question.Text = model.Text;
    question.Type = QuestionType.Text;

    _db.SurveyQuestions.Add(question);
    _db.SaveChanges();
    return Json(question, JsonRequestBehavior.AllowGet);
}

我沒有填寫代碼的每個部分，其中一些是硬編碼的，因為我將在稍后進行操作。 但是問題在於發送兩件事。 如果我不發送Id並從控制器中刪除Id，它會很好地發送序列化的模型，但是如果我同時發送它們，它將獲取Id，但不會將模型發送給他（文本和正文為空值）。 我該如何解決？

Answer 1

您可以按照以下方式進行操作：

$("#btnSubmit").click(function() {

    $.ajax({
        type: "POST",
        url: "/Survey/AddQuestion",
        // Add id like query string parameter like below
        data: $('#QuestionForm').serialize() + '&id=' + @Model.Survey.Id,
        success: function() {
            $("#AddQuestion").modal("hide");
            //alert("Survey Added");
            location.reload();
        }
    })
})

Answer 2

通過ID作為查詢字符串參數

$("#btnSubmit").click(function () {
  var data = $('#QuestionForm').serialize();

  $.ajax({
    type: "POST",
    url: "/Survey/AddQuestion?id=" + '@Model.Survey.Id',
    data: {data, @Model.Survey.Id},
    success: function () {
        $("#AddQuestion").modal("hide");
        //alert("Survey Added");
        location.reload();
    }
})
})

在控制器中，在參數前使用FromUri屬性

public JsonResult AddQuestion(SurveyQuestion model,[FromUri]int id)
{

    SurveyQuestion question = new SurveyQuestion();
    question.Body = model.Body;
    question.CreatedOn = DateTime.Now;
    question.ModifiedOn = DateTime.Now;
    question.Priority = 0;
    question.SurveyId = id;
    question.Text = model.Text;
    question.Type = QuestionType.Text;

    _db.SurveyQuestions.Add(question);
    _db.SaveChanges();
    return Json(question, JsonRequestBehavior.AllowGet);
}

Answer 3

您可以在網址中輸入id

$("#btnSubmit").click(function () {
  var data = $('#QuestionForm').serialize();

  $.ajax({
    type: "POST",
    url: "/Survey/AddQuestion?id=@Model.Survey.Id",
    data: {data},
    success: function () {
        $("#AddQuestion").modal("hide");
        //alert("Survey Added");
        location.reload();
    }
  })

})

Answer 4

嘗試此操作，在post中傳遞多個參數，或者可以使用querystring傳遞，如其他答案所示

$("#btnSubmit").click(function () {
    var data = $('#QuestionForm').serialize();

    $.ajax({
        type: "POST",
        url: "/Survey/AddQuestion",
        data: {model : data, id: @Model.Survey.Id},
        success: function () {
            $("#AddQuestion").modal("hide");
            //alert("Survey Added");
            location.reload();
        }
    })

})

調節器

public ActionResult ActionName(SurveyQuestion model, int id)
{
   Your Code .......
}