如何使用jQuery Ajax序列化表单和发布

时间:2015-02-25 07:19:10

标签: javascript jquery ajax jquery-mobile serialization

我试图从我的数据库中删除记录...... 这就是我的表格看起来像.........

@using (Html.BeginForm("RemoveDoctor", "Doctor", FormMethod.Post, new { @id = "form" }))
{
    @Html.AntiForgeryToken()
    @Html.HiddenFor(model => model.Id)
    @Html.HiddenFor(model => model.Name)
    <div class="form-actions no-color">
        <input type="submit" value="Delete" class="btn btn-default" id="submit" /> |

    </div>
}

我试图从视图中获取这些记录并传递给我的控制器Action方法........................... ..我正在尝试序列化此表单并将其发送到该操作方法,如下所示....................

  

var jsonObj = $(&#39;#form&#39;)。serialize();

它序列化表单把我的Ajax POST函数运行不了那个结果...... 它只是给了我一个错误!!!! .................我只需要将序列化值传递给我的Action方法........... ....这就是我的剧本的样子.....................

$('#submit').click(function () {

     var jsonObj = $('#form').serialize();
     alert(jsonObj);

     $.ajax({
           type: "POST",
           url: '../Doctor/RemoveDoctor',
           data: JSON.stringify({ "doctor": jsonObj }),
           success: function (data) {
                 alert(data.Message);
           },
           error: function () {
                  alert("Error!!!");
           }
      });
      return false;

});

这就是我的动作方法的样子....................

  public ActionResult RemoveDoctor(DoctorModel doctor)
  {
      bool confirmationResult = doctorManager.RemoveDoctor(doctor.Id);
      string displayMessage = string.Empty;
      if (confirmationResult == true)
           displayMessage = "You have successfully removed your record!!";
      else
           displayMessage = "Error!! Some Thing Went Wrong, Please Try Again!!";

      return Json(new { Message = displayMessage });

  }

我试图发送这个&#39; displayMessage&#39;我的jQuery代码........请一些给我一个想法如何解决这个问题.......谢谢!!!!!

1 个答案:

答案 0 :(得分:3)

试试这个

 $.ajax({
           type: "POST",
           url: '../Doctor/RemoveDoctor',
           data: $('#form').serialize(),
           success: function (data) {
                 alert(data.Message);
           },
           error: function () {
                  alert("Error!!!");
           }
      });

它会将您的表单序列化。

仅使用$('#form').serialize()进行序列化。

修改

如果您不想刷新页面,则应使用type="button"代替type="submit"

你也应该这样做

[HttpPost]
public ActionResult RemoveDoctor(DoctorModel doctor)
  {
      //...................
      return Json(new { Message = displayMessage } , JsonRequestBehavior.AllowGet);

  }

并将ajax错误函数更改为此(用于获取错误)

error: function(jqXHR, textStatus, errorThrown)
{
  alert("Error: "+errorThrown+" , Please try again");   
}