为什么无法使用ajax调用对数据执行POST请求?

时间:2016-02-19 06:22:11

标签: jquery asp.net ajax asp.net-web-api http-post

我正在尝试通过客户端代码中的POSTRequest插入数据。当请求转到控制器方法时,我无法检索发送的数据。 客户代码:

function AddUser()
    {         
        var user = { UserID: $('#UidTxt').val, UserName: $('#UnameTxt').val, Password: $('#PwdTxt').val, Email: $('#EmailTxt').val, Address: $('#AddrTxt').val, DOB: $('#DobTxt').val, Phone: $('#PhoneTxt') };
        $.ajax({
            url: 'http://localhost:61540/api/UserDetails/AddUser',
            type: 'POST',
            data: JSON.stringify(user),
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function (data) {
                alert("success! data is posted/inserted.")
            },
            error: function (xhr, status) {
                alert(xhr.ResponseText);
            }
        });
    }

Web Api控制器方法:

[System.Web.Http.AcceptVerbs("POST")]
    [ActionName("AddUser")]
    [System.Web.Http.HttpPost]
    [System.Web.Http.HttpOptions]
    public List<UserDetails> AddUser(UserDetail oUserList)
    {
        if (oUserList != null)
        { 
        db.UserDetails.Add(oUserList);
        db.SaveChanges();
        }
        var userList = db.UserDetails.ToList();
        return DTOConverter.ConvertUserDetail(userList);
    }

在调试时,调用命中控制器方法,我发现oUserList对象为null。 我正确传递数据吗?如果我错了,请纠正我。 提前谢谢。

修改

 function AddUser()
    {
        var UserID = $('#UidTxt').val();
        var UserName= $('#UnameTxt').val(); 
        var Password = $('#PwdTxt').val();
        var Email= $('#EmailTxt').val();
        var Address= $('#AddrTxt').val();
        var DOB = $('#DobTxt').val(); 
        var Phone = $('#PhoneTxt').val();
        var data = 'UserID=' + UserID + '&UserName=' + UserName + '&Password=' + Password + '&Email=' + Email + '&Address=' + Address + '&DOB=' + DOB + '&Phone=' + Phone ;
        $.ajax({ 
            url: 'http://localhost:61540/api/UserDetails/AddUser',
            type: 'POST',
            data: data,
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function (data) {
                alert("success! data is posted/inserted.")
            },
            error: function (xhr, status) {
                alert(xhr.ResponseText);
            }
        });
    }

3 个答案:

答案 0 :(得分:0)

请检查您的$ .ajax函数类型属性POST是否缺少根据您发布的代码倒转,并使用val()作为@Harish说

答案 1 :(得分:0)

javascript中的val错误,它正确的语法ix val()。更改您的javascript,如下面的代码

function AddUser()
{       
    var UserDetail = {
      UserID :$('#UidTxt').val(),
      UserName : $('#UnameTxt').val(),
      Password : $('#PwdTxt').val(),
      Email : $('#EmailTxt').val(),
      Address : $('#AddrTxt').val(),
      DOB : $('#DobTxt').val(),
      Phone :$('#PhoneTxt').val()
   };
    $.ajax({
        url: 'http://localhost:61540/api/UserDetails/AddUser',
        type: 'POST',
        data: JSON.stringify(UserDetail),
        dataType: "json",
        contentType: "application/json;charset=utf-8",
        success: function (data) {
            alert("success! data is posted/inserted.")
        },
        error: function (xhr, status) {
            alert(xhr.ResponseText);
        }
    });
}

UserDetail

创建模型
public class UserDetail
{
  public int UserID{get;set;}
  public string Username{get;set;}
  public string Password{get;set;}
  public string Email{get;set;}
  public string Address{get;set;}
  public DateTime DOB{get;set;}
  public int Phone{get;set;}
}

然后在控制器中

public JsonResult  AddUser(UserDetail oUserList)
{
    ..your code
}

根据控制器中的变量,您可以调整变量类型。
希望这有帮助

答案 2 :(得分:0)

因为,应该使用其他Val()指向而不是val,如果你想提交一个表单,而不是JSON尝试使用form.serialize()方法并检查你是否能够在服务器端获取数据