ASP.NET MVC JSON 使用两个参数获取值

Question

我试图根据 2 个参数获取值，下面是我在 JSON stringify 中添加我的 2 个参数的函数：

function GetItemLocationOnHand(itemId, locationId) {
    var data = JSON.stringify({
        itemId: itemId,
        locationId: locationId
    });
    $.ajax({
        async: true,
        type: 'GET',
        dataType: 'JSON',
        contentType: 'application/json; charset=utf-8',
        data: data,
        url: 'getItemInventory3',
        success: function (data) {
            $("#txtInventory3").val(parseFloat(data).toFixed(2));
    
        },
        error: function () {
            alert("Error")
    
        }
    });
}

下面是我在控制器中的代码，用于根据这两个参数检索我想要的数据：

[HttpGet]
public JsonResult GetItemLocationOnHand(int itemId, int locationId)
{
    var itemLocQuantity = objDB.ItemLocationDatas.Single(items => items.ItemId == itemId && items.LocationId == locationId).Quantity;
    return Json(itemLocQuantity, JsonRequestBehavior.AllowGet);
}   

在change 代码上通过下面调用此函数时，我似乎无法获取我的数据并且总是返回错误。如果我只有 1 个参数，则没有遇到错误。

请告知尝试传递 2 个参数时出了什么问题。

$("#LocationId").change(function () {
    var itemId = $("#ItemId").val();
    var locationId = $("#LocationId").val();

    GetItemLocationOnHand(itemId, locationId)
});

Answer 1

请参阅下面的示例。当对具有多个参数的 MVC 控制器执行 ajax 请求时，这对我有用。

1. 下面是我的带有多个参数的 MVC 控制器操作。

    // GET
    [HttpGet]
    public ActionResult Index(string referenceID, int typeID, int supplierID, bool isArchived)
    {
        // Do CODE here
    }
   

2. 以下是我用来获取或发布的 Ajax 请求。取决于你的需要。我使用数据类型“JSON”并将我的数据格式化为 JSON 对象。

          var formData = {referenceID: 'Test', typeID: 3, supplierID: 2, isArchived: false};
          $.ajax({
            type: 'GET',
            cache: false,
            url: getActionUrl, // url: domain/controller/action |or| domain/area/controller/action
            dataType: 'json',
            contentType: 'application/json; charset=utf-8',
            headers: headers, // ignore if not needed. I use it for __RequestVerificationToken
            data: formData,
            success: function (data, status, xml) {
                // do something with the data
            },
            error: function (xml, status, error) {
                console.log(xml)
                // do something if there was an error
            },
            complete: function (xml, status) {
            }
        });
   

我认为您的问题可能是您使用的是“JSON.stringify”。它可能会将您的 JSON 字符串解释为单个参数输入，而不是两个单独的参数。

请参阅以下文档中的 sn-ps。 https://api.jquery.com/jquery.ajax/

• 如果指定了 json，则使用 jQuery.parseJSON 解析响应，然后将其作为对象传递给成功处理程序。解析后的 JSON 对象可通过 jqXHR 对象的 responseJSON 属性获得。
• data 选项可以包含形式为 key1=value1&key2=value2 的查询字符串，或形式为 {key1: 'value1', key2: 'value2'} 的对象。如果使用后一种形式，则数据在发送之前使用 jQuery.param() 转换为查询字符串。可以通过将 processData 设置为 false 来规避此处理。如果您希望将 XML 对象发送到服务器，则该处理可能是不可取的；在这种情况下，请将 contentType 选项从 application/x-www-form-urlencoded 更改为更合适的 MIME 类型。

Answer 2

只是为了避免一些误解 AJAX GET 的工作原理并设置一些您不必设置的参数（即您还没有深入了解 jQuery AJAX），您可以使用他们也实现的快捷方式，即 $.get 所以您的请求看起来就这么简单，你不会出错，因为它将使用正确的 GET 默认值。如果您希望将响应视为 JSON，只需将响应标头（来自支持的）的 Content-type 设置为 application/json。这将由 jQuery AJAX 响应处理程序进行检查，并将传入数据解析为 JSON。

    var data = {itemId: 1, locationId: 2 };
    $.get('GetItemLocationOnHand', data, function (data) {
      $("#txtInventory3").val(parseFloat(data).toFixed(2));    
    }).fail(function (jqXHR, textStatus ) {
      alert(`Error = ${jqXHR.status} ${textStatus}`);
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 3

通过执行以下操作解决了问题：

• 添加了正确的 URL，即 GetItemLocationOnHand

• 移除 Stringify 并使用 var data = ({ itemId: itemId, locationId: locationId });

非常感谢 Freedom and Reflective 和其他人的 cmets！

 function GetItemLocationOnHand(itemId, locationId) {
        var data = ({ itemId: itemId, locationId: locationId });


        $.ajax({
            async: true,
            type: 'GET',
            dataType: 'JSON',
            contentType: 'application/json; charset=utf-8',
            data: data,
            url: 'getItemLocationOnHand',
            success: function (data) {
                $("#txtInventory3").val(parseFloat(data).toFixed(2));

            },
            error: function () {
                alert("Error")

            }
        });

    }