Question

我有一个部分视图工作正常的ajax请求并获取用户编辑所需的信息，现在当用户按下保存按钮时数据保存但它仍然重定向到不存在的CameraInfo / Index，是否可以保存并保持在同一页面上？如果不可能，甚至返回主页？下面是HTTP Post中涉及的方法并且涉及到代码

AJAX

 $(document).ready(function () {
        $('#qr-number').on('change', function () {
            $.ajax({
                type: "Get",
                url: '/CameraInfo/Edit',
                data: { id: $('#qr-number').val() },
                success: function (response) {
                    $('#Sample').html(response);
                },
                error: function (response) {
                    if (response.responseText != "") {
                        alert(response.responseText);
                        alert("Some thing wrong..");
                    }
                }
            });
        });
    });

_CameraInfo.cshtml（局部视图）

@model JobTracker.Models.Job


<h2>Edit and Confirm</h2>

@using (Html.BeginForm()) {
@Html.ValidationSummary(true)

<fieldset>
    <legend>Job</legend>

    @Html.HiddenFor(model => model.JobID)

    @Html.HiddenFor(model => model.OrderID)

  <div class="editor-label">
        @Html.LabelFor(model => model.LocationID, "Location")
    </div>
    <div class="editor-field">
        @Html.DropDownList("LocationID", String.Empty)
        @Html.ValidationMessageFor(model => model.LocationID)
    </div><br />

    <div class="editor-label">
        @Html.LabelFor(model => model.HighPriority)
    </div>
    <div class="editor-field">
        @Html.DropDownListFor(model => model.HighPriority, new SelectList(
    new[] 
    { 
        new { Value = "Yes", Text = "Yes" },
        new { Value = "No", Text = "No" },
    },
     "Value",
     "Text",
    Model
))

        @Html.ValidationMessageFor(model => model.HighPriority)
    </div><br />

    <div class="editor-label">
        @Html.LabelFor(model => model.Comments)
    </div>
    <div class="editor-field">
        @Html.TextAreaFor(model => model.Comments)
        @Html.ValidationMessageFor(model => model.Comments)
    </div><br />

      <div class="editor-label">
        @Html.LabelFor(model => model.Status)
    </div>
    <div class="editor-field">
           @Html.DropDownListFor(model => model.Status, new SelectList(
    new[] 
    { 
        new { Value = "In Progress", Text = "In Progress" },
        new { Value = "Completed", Text = "Completed" },
        new { Value = "Not Started", Text = "Not Started" },
        new { Value = "Stopped", Text = "Stopped" },
    },
     "Value",
     "Text",
    Model
))
        @Html.ValidationMessageFor(model => model.Status)
    </div><br />

    <p>
        <input type="submit" value="Save" />
    </p>
</fieldset>

}

CameraInfo.cs

       [HttpGet]
    public ActionResult Edit(int id = 0)
    {
        Job job = db.Jobs.Find(id);

        ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", job.LocationID);


        return PartialView("_CameraInfo", job);
    }


    [HttpPost]
    public ActionResult Edit(Job job)
    {
        if (ModelState.IsValid)
        {
            var LastUpdated = System.DateTime.Now;
            job.LastUpdated = LastUpdated;
            db.Entry(job).State = EntityState.Modified;
            db.SaveChanges();
        }
        ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", job.LocationID);

        return View(job);
    }

Answer 1

如果是AJAX呼叫，则用户不应该进行导航。违规代码很可能在视图中，可能是一个POST到URL而不是执行AJAX调用的表单？

编辑：现在您已经显示了查看代码，我的怀疑得到了确认。您不应该使用常规表单，因为这将使用户在POST值时进行导航。另一种方法是使用AjaxForms而不是常规表单。另一个是阻止表单提交，而是通过JavaScript自己提交值。

我实际建议最后一个：使用JavaScript提交，但保留表单。因此，如果目标受众中的某些人可以禁用JavaScript，则可以使用常规POST和用户导航进行设计。如果他们这样做，您可以通过在表单的提交事件上返回false来避免导航。

保存局部视图后如何保持同一页面

1 个答案: