AJAX对控制器操作的调用不一致

本文关键字:调用 不一致 操作 控制器 AJAX | 更新日期: 2023-09-27 18:00:45

我在ASP.NET MVC4中有一个简单的表单,其中有一个文本框和两个按钮。

@using (Html.BeginForm("Steps", "Technique", new 
                      { step = ViewBag.step + 1, 
                         techniqueId = @Model.Krok.TechniqueId
                      },
                      FormMethod.Post,
                      new { id = "theForm" })
       )
 { 
    <label>@Model.Krok.Text</label>
    @Html.HiddenFor(model => model.Krok.Id)
    @Html.HiddenFor(model => model.Krok.Poradi)
    @Html.HiddenFor(model => model.Krok.TechniqueId)
    @Html.TextBoxFor(m => m.Text)
    if (@Model.Krok.HasMultipleAnswers)
    <input type="button" value="Add One More" id="AddButton" />
    <input type="submit" value="Next Step" id="submit_btn" />
}
<input type="button" value="Add One More" id="add_btn" />
<input type="submit" value="Next Step" id="submit_btn" />

第一个按钮使用jQuery再创建一个文本框,第二个按钮处理所有文本框并将数据存储到SQL中。

$("#add_btn").click(function () {
        $("#theForm").append("<br /><label> one more attribute</label>")
                     .append("<input type = 'Text' id='_addText' />");
    });

一旦单击处理表单的按钮,jQuery就会处理此事件并将数据发送到控制器操作。

$("#submit_btn").click(function () {
        alert("clicked!")
        var options = {};
        options.url = "/Technique/AjaxTest";
        options.type = "POST";
        options.data = JSON.stringify(
        {
            answer: $("#_addText").val()
        });
        options.contentType = "application/json";
        options.dataType = "json";
        options.error = function (jqXHR, status, err) { alert(status); };
        $.ajax(options);
    });

但这个控制器操作并没有一致地呈现,这意味着有时该操作会被激发并按照它必须处理的方式进行处理,但另一次该操作甚至没有被调用(我使用的是调试器)。为什么它不能始终如一地工作?

AJAX对控制器操作的调用不一致

按钮点击的默认操作,即表单的HTTPPOST提交,似乎没有被抑制,这可能发生在jQuery操作之前。

如果你有

$("#submit_btn").click(handleSubmit);
function handleSubmit(e) {
    e.preventDefault();
    e.stopPropagation();
    alert("clicked");
    ......
}

然后您就可以使用HTTPPOST了。