我正在尝试在使用Razor的MVC4中使用Jquery Model Dialog,对话框显示正常,但是单击更新按钮后AjaxOptions.OnSuccess JavaScript函数不会调用,而是重定向到http://<>:3738/Cars/Edit/1?Length=4,我不知道为什么会发生这种情况。
以下是我的代码:
以下是我的代码:
CarController.cs
public class CarsController : Controller
{
private ExpDb db = new ExpDb();
//
// GET: /Cars/
public ActionResult Index()
{
return View(db.Cars.ToList());
}
//
// GET: /Cars/Edit/5
public ActionResult Edit(int id = 0)
{
CarModel carmodel = db.Cars.Find(id);
if (carmodel == null)
{
return HttpNotFound();
}
return PartialView(carmodel);
}
//
// POST: /Cars/Edit/5
[HttpPost]
public JsonResult Edit(CarModel carmodel)
{
if (ModelState.IsValid)
{
db.Entry(carmodel).State = EntityState.Modified;
db.SaveChanges();
//return RedirectToAction("Index");
return Json(JsonResponseFactory.SuccessResponse(carmodel),JsonRequestBehavior.DenyGet);
}
else {
return Json(JsonResponseFactory.ErrorResponse("Please review your form"), JsonRequestBehavior.DenyGet);
}
}
Index.cshtml
@model IEnumerable<AjaxSamples.Models.CarModel>
@{
ViewBag.Title = "Index";
}
<div id="commonMessage"></div>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.ImageFileName)
</th>
<th>
@Html.DisplayNameFor(model => model.Name)
</th>
<th>
@Html.DisplayNameFor(model => model.Description)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.ImageFileName)
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.Description)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.Id }, new { @class = "editLink" }) |
@Html.ActionLink("Details", "Details", new { id=item.Id }) |
@Html.ActionLink("Delete", "Delete", new { id=item.Id })
<button id="opener">Open Dialog</button>
</td>
</tr>
}
</table>
<div id="updateDialog" title="Update Car"></div>
<script type="text/javascript">
var linkObj;
$(function () {
$(".editLink").button();
$('#updateDialog').dialog({
autoOpen: false,
width: 400,
resizable: false,
modal: true,
buttons: {
"Update": function () {
$("#update-message").html(''); //make sure there is nothing on the message before we continue
$("#updateCarForm").submit();
},
"Cancel": function () {
alert('sd');
$(this).dialog("close");
}
}
});
$(".editLink").click(function () {
//change the title of the dialog
linkObj = $(this);
var dialogDiv = $('#updateDialog');
var viewUrl = linkObj.attr('href');
$.get(viewUrl, function (data) {
alert(data);
dialogDiv.html(data);
//validation
var $form = $("#updateCarForm");
// Unbind existing validation
$form.unbind();
$form.data("validator", null);
// Check document for changes
$.validator.unobtrusive.parse(document);
// Re add validation with changes
$form.validate($form.data("unobtrusiveValidation").options);
//open dialog
dialogDiv.dialog('open');
});
return false;
});
});
function err(data) {
alert(data);
}
function updateSuccess(data) {
alert(data);
}
Edit.cshtml
@model AjaxSamples.Models.CarModel
@{
ViewBag.Title = "Edit";
}
@using (Ajax.BeginForm("Edit", "Cars", new AjaxOptions
{
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnSuccess = "updateSuccess"
}, new { @id = "updateCarForm" }))
{
@Html.ValidationSummary(true)
<div id="update-message" class="error invisible"></div>
<fieldset>
<legend>CarModel</legend>
@Html.HiddenFor(model => model.Id)
<div class="editor-label">
@Html.LabelFor(model => model.ImageFileName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ImageFileName)
@Html.ValidationMessageFor(model => model.ImageFileName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Description)
@Html.ValidationMessageFor(model => model.Description)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>