Question

我在MVC中单击按钮（ajax调用）时尝试增加计数，但值仅增加一次。实际上我在增量后更新了模型，但它没有保持更新的模型。请建议如何解决？

我的最终目标是：我想要的是在ajax调用我想将模型传递给actionmethod并做一些设置值来建模和发回。而下一个按钮单击我必须发送更新的模型。多数民众赞成。

public class MyModel
{
    public int Integer { get; set; }
    public string Str { get; set; }
}

public class Test1Controller : Controller
{
    [HttpGet]
    public ActionResult Index()
    {
        var m = new MyModel();
        return View("Test1", m);
    }

    [HttpPost]
    public ActionResult ChangeTheValue(MyModel model)
    {
        model.Integer++;
        UpdateModel(model);
        return Json(model.Integer.ToString());

    }

}
enter code here
@model MvcApplication2.Model.MyModel

 @{
    ViewBag.Title = "Test1";
  }
  <script src="~/Scripts/jquery-2.2.0.js"></script>
  <script src="~/Scripts/jquery-ui-1.11.4.js"></script>

   <h2>Test1</h2>
   @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "form1"         }))
   {
      <div>
       <input type="button" onclick="ajaxcall()" id="changeButton" value="Click Me!" />
       <input type="text" value="@Model.Integer" class="txt" id="str" name="str" />

     </div>
     }
     <script type="text/javascript">
       function ajaxcall() {
            $.ajax({
            type: 'POST',
            url: '@Url.Action("ChangeTheValue", "Test1")',
            data: $('form1').serialize(),
            cache: false,
            async: true,
            success: function (data) {
                 $("#str").val(data);
            },
            error: function (data) {
                 alert("Err " + data);
            }

          });
         }


        </script>

Answer 1

尝试通过str的值而不是整个表单发送数据：

function ajaxcall() {
            $.ajax({
            type: 'POST',
            url: '@Url.Action("ChangeTheValue", "Test1")',
           data: $('#str').val(),
            cache: false,
            async: true,
            success: function (data) {
                 $("#str").val(data);
            },
            error: function (data) {
                 alert("Err " + data);
            }

          });

Answer 2

首先，你的表单的jQuery选择器是错误的！由于form1是ID，因此您应在其前面添加#

data: $('#form1').serialize(),

在Action方法中，您正在更新属性Integer的值。但是您在ajax调用之后将其设置为名称为str的字段。因此，下次再次单击时，它将读取Integar属性的默认值（为0并将其一次增加为1）并再次返回。（对于所有点击都会发生这种情况，因为您没有发送该属性的更新值）。理想情况下，您应该修复表单以获得正确的字段名称

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "form1" }))
{
    <div>
        <input type="button" onclick="ajaxcall()" id="changeButton" value="Click Me!" />
        @Html.TextBoxFor(f => f.Str)
        @Html.TextBoxFor(f=>f.Integer)

    </div>
}

在成功事件中，您应该更新Integer属性的表单字段。

success: function (data) {
   $("#Integer").val(data);
},

如何在MVC中单击按钮单击时增加值（ajax调用不是表单提交）？

2 个答案: