使用 Ajax 发送数据并在控制器中接收时出错

Question

我正在发送 Json 数据，但是当我在控制器中验证我的方法时，它以 null 的形式到达

html:

<div class="hijo">
                    @Html.LabelFor(m => m.Proyecto, new { @class = "", style = "color:#040404" })
                    @Html.DropDownListFor(Model => Model.ProyectoID, Model.Proyecto, "Seleccionar")
                    @Html.ValidationMessageFor(Model => Model.Proyecto, null, new { @class = "label label-danger", id = "Proyecto" })
                </div>
<div class="hijo">
                    <input type="button" id="adicionar" value="Agregar" class="myButton">
                </div>

JS：

$('#adicionar').click(function () {
        debugger;
        var data= {
        Proyecto: $("#ProyectoID option:selected").text()
    };
    $.ajax({
        url: "../ManejoDatos",
        type: "POST",
        dataType: "json",  
        data: JSON.stringify(data),
        success: function (mydata) {
            $("#UpdateDiv").html(mydata);
            history.pushState('', 'New URL: ' + href, href); // This Code lets you to change url howyouwant
        }
    });
 }

我的控制器

public JsonResult ManejoDatos(string Proyecto)
    {
         ........
         ...
        return Json(Proyecto);
    }

控制台

我不知道它是否很容易修复，但我没有看到错误

问候

Answer 1

我发现您的JavaScript 代码绝对没问题。奇怪的是，您的格式的控制器无法正常工作，但我通过以下方式取得了成功：

        [System.Web.Http.HttpPost]
        public HttpResponseMessage ManejoDatos(string Proyecto)
        {
            var data = " my test data ";
            return Request.CreateResponse(HttpStatusCode.OK, data);
        }

我显然会调查并再次更新答案。

希望以上想法能帮助您解决问题。如果您遇到任何问题，请告诉我。

Answer 2

string,int,float 等简单类型将从 .Net 框架中的查询字符串中获取，而复杂类型总是从正文中获取。

解决方案 1

在这种情况下，.Net Framework 期望来自查询参数的字符串 Proyecto，您可以像这样调用您的 API，而无需对服务器端代码进行任何更改

注意：你也不需要定义参数的键（在http请求中），它被定义为[From Body]。总共可以使用[FromBody] 属性传递一种简单类型，您可以在下面看到这样的=ProyectoValue

POST ../ManejoDatos HTTP/1.1
Host: localhost:59353
Content-Type: application/x-www-form-urlencoded
=ProyectoValue

解决方案 2

或者您可以通过将所有参数放入复杂模型中来调用您的 API，并通过正文而不是像这样的查询参数传递参数

复杂类型模型

public class MyModel
    {
        public string Proyecto{ get; set; }
    }

API 代码

public JsonResult ManejoDatos(MyModel myModel)
    {
         //Access using mymodel.Proyecto
         ........
         ...
        return Json(mymodel.Proyecto);
    }

现在您可以像这样通过 body 传递参数来使用您的 API

POST ../ManejoDatos HTTP/1.1
Host: localhost:59353
Content-Type: application/x-www-form-urlencoded

proyecto=myproyecto