Ajax Parameter Being Received as {string[0[} in MVC Controller

First of all, I have never successfully built an AJAX call that worked. This is my first real try at doing this.

I am working on building a function to update existing records in a SQL database. I am using ASP.NET Core (.NET 6) MVC but I also use JavaScript and jQuery. I cannot have the page refresh, so I need to use ajax to contact the Controller and update the records.

I have an array that was converted from a NodeList. When I debug step by step, the collectionsArray looks perfectly fine and has data in it.

//Create array based on the collections list
    const collectionsArray = Array.from(collectionList);

    $.ajax({
        method: 'POST',
        url: '/Collections/UpdateCollectionSortOrder',
        data: collectionsArray,
    })
        .done(function (msg) {
            alert('Sent');
        });

However, when I run the application and debug the code, the array is received in the Controller as {string[0]}.

Here is the method which is in the Controller, with my mouse hovered over the parameter:

enter image description here

Do not pay attention to the rest of the code in the controller method. I have not really written anything in there of importance yet. I plan to do that once the data is correctly transferred to the Controller.

I have tried dozens of ideas including what you see in the Controller with the serialize function, just to see if it processes the junk data that is getting passed, but it hasn’t made a difference.

I have been Googling the issue & reading other StackOverflow posts. I’ve tried things like adding/changing contentType, dataType, adding ‘traditional: true‘, using JSON.stringify, putting ‘data: { collections: collectionsArray }‘ in a dozen different formats. I tried processing it as a GET instead of POST, I tried using params.

I am out of ideas. Things that have worked for others are not working for me. What am I doing wrong? I’m sure it’s something minor.