如何使用ajax / javascript更新数据库而不刷新页面asp.net mvc [英] How to update database with ajax/javascript without refreshing page asp.net mvc

问题描述

我想通过执行ajax调用没有刷新我的页面，在我的数据库中将枚举列表的值从活动更改为非活动状态？我该怎么做呢？ javascript方法还是ajax.beginform？在这里不确定...

I want to change the value of an enumdropdownlist from active to inactive in my database by doing some ajax call WITHOUT refreshing my page? How do I do this? javascript method or ajax.beginform? not sure here...

我尝试了ajax.beginform并且调用得到了控制器ok，但之后它尝试通过返回来刷新/渲染视图作为一个动作结果。我不希望它刷新视图，因为我丢失了我的viewmodel数据。我以为ajax.beginform只刷新了表单里面的内容？我需要在javascript方法中执行此操作吗？
如何防止在我的操作方法中刷新/呈现视图？

I tried ajax.beginform and the call gets made the to the controller ok, but then it tries to refresh/render a view by returning it as a actionresult. I don't want it to refresh the view because I loose my viewmodel data. I thought ajax.beginform only refreshed what was inside the form? Do I need to perform this in a javascript method instead? What do I do to prevent a view from being refreshed/rendered in my action method?

这是我的ajax表单。如果我返回一个视图，我会丢失所有模型视图数据，因此model.statusenabled为null！我不明白为什么它是null因为它在ajaxform之外......

here is my ajax form. If I return a view I loose all the 'Model' view data, so model.statusenabled is null! I don't understand why its null because it's outside of the ajaxform...

@if (Model.StatusEnabled)
      {
          using (Ajax.BeginForm("UpdateStatus", "Student", new AjaxOptions
          {
              HttpMethod = "post",
              OnSuccess = "dotcolor();"
          }))
          {
              @Html.EnumDropDownListFor(model => model.Status, new { @class = "btn btn-default btn-lg dropdown-toggle", onchange = "this.form.submit();", id = "enumstatus" })
          }
      }
      else
      {
         @Html.EnumDropDownListFor(model => model.Status, new { @class = "btn btn-default btn-lg dropdown-toggle", disabled = "disabled" })
      }

这是我的行动方法

    [HttpPost]
    public ActionResult UpdateStatus()
    {
        //update database
        // don't return view because it gets refreshed
        // and I have to re pass in my viewmodel
        return View("Edit"); 
    }

如果我在UpdateStatus（）中将返回类型更改为void，它仍会尝试返回一个名为UpdateStatus的视图。不是我想要的。

if I change the return type to void in UpdateStatus() it still attemptsto return a view called UpdateStatus. Not what I want.

推荐答案

使用jquery和ajax发布所选值相对容易

This is relatively easy using jquery and ajax to post the selected value

Html

@Html.EnumDropDownListFor(m => m.Status, new { @class = "btn btn-default btn-lg dropdown-toggle" })

脚本

var id = '@Model.ID'; // store the ID of the student (change to suit your property name)
var url = '@Url.Action("UpdateStatus", "Student")';
$('#Status').change(function() {
  var status = $(this).val();
  $.post(url, { ID: id, Status: status }, function(data) {
    // do something with the returned value e.g. display a message?
    // for example - if(data) { // OK } else { // Oops }
  }
}

控制器

[HttpPost]
public ActionResult UpdateStatus(int ID, EmployeeStatus Status) // assumes the enum is typeof EmployeeStatus 
{
  // update the employees status based on the parameters
  return Json(true); // or return Json("some message")
}

注意，您可能希望检查状态是否确实已更新，例如在catch块中您可能返回Json（null）或返回Json（一些错误消息）然后您可以使用它在页面上显示消息

Note, you will probably want to check that the status was indeed updated, for example in a catch block you might return Json(null) or return Json("some error message") which you could then use to display a message on the page

这篇关于如何使用ajax / javascript更新数据库而不刷新页面asp.net mvc的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！