Mvc表单数据未发布到Asp.net Web API控制器

I have following cshtml in my view:

我在视图中有以下cshtml:

<div>
    @(Html.Kendo().DropDownList()
            .Name("Designation")
            .DataValueField("Designation")
            .DataTextField("Designation")
            .SelectedIndex(0)
            .BindTo((System.Collections.IEnumerable)ViewData["Designation"]))
    @(Html.Kendo().DropDownList()
            .Name("DeptId")
            .DataValueField("DeptId")
            .DataTextField("DeptName")
            .SelectedIndex(0)
            .BindTo((System.Collections.IEnumerable)ViewData["Department"]))
    <input class="k-button" id="btnFilter" type="submit" value="Filter" />
</div>

I want to post the value of both dropdownlist to my Web ApiController. I have created the following jquery ajax method to call the api. But it is not working.

我想将dropdownlist的值发布到我的Web ApiController。我创建了以下jquery ajax方法来调用api。但它没有用。

JQuery:

$(document).ready(function () {
        $("#btnFilter").click(function () {
            debugger;
            var designation = $("#Designation").val();
            var deptname = $("#DeptId").val();
            $.ajax({
                url: "http://localhost:8648/api/Employee" + deptname + designation,
                type: "Post",
                // data: JSON.stringify([designation, deptname]), //{ Name: name, 
                // Address: address, DOB: dob },
                contentType: 'application/json; charset=utf-8',
                success: function (data) { alert("posted") },
                error: function () { alert('error'); }
            });
        });
    });

Here is my API Controller Post Method:

这是我的API控制器发布方法:

public HttpResponseMessage PostEmployee(EmployeeViewModel newEmployee, String deptname, String designation)
        {
           //code
        }

How can i send the value of dropdownlost to my ApiController.

如何将dropdownlost的值发送到我的ApiController。

3 个解决方案

#1

According to your question you want to post only dropdown data then Try this

根据您的问题,您只想发布下拉数据然后试试这个

$(document).ready(function () {
        $("#btnFilter").click(function () {
            debugger;
            var designation = $("#Designation").val();
            var deptname = $("#DeptId").val();
            $.ajax({
                url: "http://localhost:8648/api/Employee?deptname="+deptname+"&designation="+designation ,
                type: "Post",                    
                contentType: 'application/json; charset=utf-8',
                success: function (data) { alert("posted") },
                error: function () { alert('error'); }
            });
        });
    });

Api controller

public HttpResponseMessage PostEmployee(String deptname, String designation)
        {
           //code
        }

#2

you are using GET method whereas your API method is POST

您使用的是GET方法,而您的API方法是POST

your request will look like something like this

您的请求看起来像这样

$(document).ready(function () {
        $("#btnFilter").click(function () {
            debugger;
            var designation = $("#Designation").val();
            var deptname = $("#DeptId").val();
            $.ajax({
                url: "http://localhost:8648/api/Employee/PostEmployee",
                type: "Post",
                data: {"newEmployee":/*your serialized data for the model*/,
                      "deptname":deptname ,"designation":designation }
                contentType: 'application/json; charset=utf-8',
                success: function (data) { alert("posted") },
                error: function () { alert('error'); }
            });
        });
    });

#3

You are trying to send the data as part of the request url. You would only do this if you were making a get request.

您正尝试将数据作为请求网址的一部分发送。如果您要提出请求,则只会执行此操作。

If you wish to do this as a get request you need to specify in your $.ajax function that it's a GET request and construct the url correctly:

如果您希望将此作为get请求执行,则需要在$ .ajax函数中指定它是GET请求并正确构造url:

$.ajax({
          //construct the url with the data as part of the query string
          url: "http://localhost:8648/api/Employee?deptname="+deptname+"&designation="+designation ,
          //specify it's a get request
          type: "GET",                    
          contentType: 'application/json; charset=utf-8',
          success: function (data) { alert("posted") },
          error: function () { alert('error'); }
      });
});

With your api controller like this:

使用这样的api控制器:

[HttpGet]
public HttpResponseMessage PostEmployee(String deptname, String designation)
{

}

However, if you wish to do this as a POST request you need to send the data in the body of the request:

但是,如果您希望以POST请求的形式执行此操作,则需要在请求正文中发送数据:

$.ajax({
          url: "http://localhost:8648/api/Employee,
          //specify it's a POSTrequest
          type: "POST",                    
          contentType: 'application/json; charset=utf-8',
          //send data as part of body
          data: {designation: designation, deptname: deptname}
          success: function (data) { alert("posted") },
          error: function () { alert('error'); }
      });
});

With your api controller looking like this:

你的api控制器看起来像这样:

[HttpPost]
public HttpResponseMessage PostEmployee(String deptname, String designation)
{

}

#1