使用Ajax将数组从视图传递给控制器，但在实际操作中，数组显示为空

I am passing an array from view to controller using Ajax but, on action, the array shows empty.

我正在使用Ajax将一个数组从视图传递给控制器，但在实际操作中，该数组显示为空。

This is my code:

这是我的代码:

View

视图

$("#btn").click(function () {
            debugger
             arry = [];
                $.ajax({
                type: "Post",
                url: "/Main/CheckBoxes",
                data: { Values: arr["48","47","46"] },
                success: function () {
                    alert("array: " + arry.join(', '));
                },
                error: function () {
                    alert("error");
                }
            })


        });

Action

行动

 public ActionResult array(string[] Values)
      {
          for (int id = 0; id < Values.Length; id++)
          {
              string newID = Values[id];
          }

        return View();
    }

2 个解决方案

#1

  jQuery.ajaxSettings.traditional = true;

$("#btn").click(function () {
            debugger
             arry = [];
                $.ajax({
                type: "Post",
                url: "/Main/CheckBoxes",
                data: { Values:["48","47","46"]},//just edit this line
                success: function () {
                    alert("array: " + arry.join(', '));
                },
                error: function () {
                    alert("error");
                }
            })


        });

#2

Your code has some issues regarding how you are sending the data! What is your expectation when you execute this expression arr["48","47","46"] ????? That is going to give you undefined and that is what you are trying to send!

您的代码有一些关于如何发送数据的问题!当你执行这个短语arr(“48”、“47”、“46”)时，你的期望是什么?这会给你一个没有定义的结果，这就是你要发送的!

There are two ways to fix your code. You can send the array in the request body. For this, you need create a JSON string from the array and send that as the data property while explicitly specifying the request content-type header value as "application/json". You may use the JSON.stringify method to get the JSON string of your js array.

有两种方法可以修复代码。可以在请求体中发送数组。为此，需要从数组中创建一个JSON字符串，并将其作为数据属性发送，同时显式地将请求内容类型的标头值指定为“application/ JSON”。您可以使用JSON。stringify方法获取js数组的JSON字符串。

Also, make sure you are making the call to the correct action method. In your question you shared the array action method code, but in your client side script you were trying to call a different action method(`Checkboxes)!

另外，确保您正在调用正确的操作方法。在您的问题中，您共享了数组操作方法代码，但是在您的客户端脚本中，您试图调用一个不同的操作方法('复选框)!

This should work.

这应该工作。

var arry = ["48", "47", "46"];
var url = "@Url.Action("array", "Main")";  // Update your real url here
// If your script is inside the razor view, you can us Url.Action (c#) method

$.ajax({
    type: "Post",
    url: url ,
    data: JSON.stringify(arry),
    contentType: "application/json",
    success: function(r) {
        alert("Success");
        console.log(r);
    },
    error: function() {
        alert("error");
    }
});

Another option is to send a javascript object with Values property (which has the array as the value of it) as the data property value of the $.ajax call. Now the request content-type header will be application/x-www-form-urlencoded; and the array will be sent as FormData in the request.

另一种选择是发送一个带有值属性(它的值是数组)的javascript对象作为$的数据属性值。ajax调用。现在请求内容类型的头将是application/ www-form- urlencodes;数组将作为FormData发送到请求中。

var arry = ["48", "47", "46"];

$.ajax({
    type: "Post",
    url: "/Main/array",
    data: { Values: arry },
    success: function(r) {
        console.log(r);
    },
    error: function() {
        alert("error");
    }
});