We Keep Coding

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:
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.
UPDATE: Here is the code which explains what the collectionList object is:
//Re-assign SortID's via each row's ID value
var collectionList = document.querySelectorAll(".collection-row");
for (var i = 1; i <= collectionList.length; i++) {
collectionList[i - 1].setAttribute('id', i);
}
What I am doing is getting a list off the screen and then re-assigning the ID value, because the point of this screen is to change the sort order of the list. So I'm using the ID field to update the sort order, and then I plan to pass the new IDs and names to the DB, once I can get the array to pass through.
UPDATE: SOLVED!
I want to post this follow up in case anyone else runs into a similar issue.
Thanks to #freedomn-m for their guidance!
So I took the NodeList object (collectionList) and converted it to a 2-dimensional array, pulling out only the fields I need, and then I passed that array onto the controller. My previous efforts were causing me to push all sorts of junk that was not being understood by the system.
//Create a 2-dimensional array based on the collections list
const collectionArray = [];
for (var i = 0; i < collectionList.length; i++) {
collectionArray.push([collectionList[i].id, collectionList[i].children[1].innerHTML]);
}
$.ajax({
method: 'POST',
url: '/Collections/UpdateCollectionSortOrder',
data: { collections: collectionArray }
})
.done(function (msg) {
alert('Sent');
});
2-d array is coming through to the Controller successfully

Looping through HTML form data via JSON arrays/objects?

I have been scouring this website and the internet for a few hours now, and asked a question earlier which got me at least a step further.. However I am really struggling to understand how to save multiple arrays to my localStorage.
I can understand the process using a hardcoded array, but as soon as I try to implement the localStorage data, I can't understand what to do.
Heres what I have tried so far (with help from another SO user):
$("#submit").click(function () {
// prepare
var formData = $("#regForm").serializeArray();
// get all stored as Array []
var bookings = JSON.parse(localStorage.getItem('bookings') || '[]');
for (formData = 0; formData < localStorage.length; formData++) {
// insert and save
localStorage.setItem("bookings", JSON.stringify([formData]));
}
});
It works fine without the for loop, however when I resubmit the form with new data it replaces it rather than creates a new index?
Basically I am trying to create an appointment scheduler for dog walking and I need to be able to view each booking, amend, delete, and of course view the bookings (all client side - no databases).
Should I be initialising my array first? How to I approach the for loop? Any help is appreciated as I want to learn but I have been at this for hours with no luck.

You can use like following.
Save new values in the the previously stored values in variable and update the local storage at the end.
$("#submit").click(function () {
var formData = $("#regForm").serializeArray();
var bookings = JSON.parse(localStorage.getItem('bookings') || '[]');
for (formData = 0; formData < localStorage.length; formData++) {
bookings.push(formData)
}
localStorage.setItem("bookings", JSON.stringify(bookings));
});

CRM 2016 - Programmatically filtering subgrid

I am trying to filter this subgrid ShipmentReportsInformation by the end customer field to show only the end customer records of the account that I'm currently viewing. Right now it's showing all of them (can't use the "show only related records" in the form because it's just text).
I'm using Microsoft Dynamics 2016 on-premesis.
So I made a web resource (onload event) and this is what I have put together so far:
function Filter(){
var str = Xrm.Page.getAttribute('name').getValue(); //this contains the correct text
//alert(str);
var AllRows = Xrm.Page.getControl("ShipmentReportsInformation").getGrid().getRows(); //all rows inserted in AllRows
var FilteredRows = AllRows.forEach(function (AllRows, i) {
if(Xrm.Page.getAttribute('new_endcustomer').getValue() == str){
FilteredRows.push(AllRows.getData().getEntity().getEntityReference());
}
//Now I think I should only have the lines added to the FilteredRows variable that match the if condition
});
Xrm.Page.getControl("ShipmentReportsInformation").setData(FilteredRows); //putting the data from the var in the subgrid
}
I'm pretty new at coding, so please, if I do something ridiculous there, you know.
Sadly, it's not working and the log/error report I get isn't any help at all. The error and the form, to illustrate:
http://prntscr.com/cwowlf
Can anyone help me spot the issues in the code please?
I even think it's loading the code before the subgrid is loaded but I don't know how to properly delay it. I tried .getreadystate != complete but it's never complete according to that.
Just to help out with what I found so far: here is where I got most of my information from:
-https://msdn.microsoft.com/en-us/library/dn932126.aspx#BKMK_GridRowData
Kind regards

Although the question is old, I was trying to find a way to filter a subgrid and stumbled upon this post. According to the SDK, this is what is mentioned for the setData method:
Web resources have a special query string parameter named data to pass
custom data. The getData and setData methods only work for Silverlight
web resources added to a form
Cheers

How to get values from the store in extjs4

I have a store that fetches data from the zend server. I want to get the store records to do some customizations on my form. For getting data from store i am using the below code.
var index = Ext.StoreMgr.lookup('product.AttributeComboBox').find('abbr',4);
var reco = Ext.StoreMgr.lookup('product.AttributeComboBox').getAt(index);
Above snippet returns no records. Please let me know where i am wrong.

In your debugger check the store exists
Ext.StoreMgr.lookup('product.AttributeComboBox')
Check how many records are in the store
Ext.StoreMgr.lookup('product.AttributeComboBox').data.items
Check the records have parsed properly
What came from the server for the record
Ext.StoreMgr.lookup('product.AttributeComboBox').data.items[0].raw
How it get converted into the record
Ext.StoreMgr.lookup('product.AttributeComboBox').data.items[0].data

Can you show us more code ?
So far, seems ok but you will have to check if the store have been created and if it has all the records, just like RichH said.
To check if the Store exists I would do
var productStore = Ext.getStore('product.AttributeComboBox');
console.log(productStore );
To check if the store is loaded
console.log(productStore.getCount());
To find the record
console.log(productStore.findRecord('abbr','4'));

Displaying data in dojo grid

I have a hash map dataFields = {"element1":1,"element2":2,"element3":3} and I am trying to display the data in a dojo grid. However, when I set up my data store like:
var data = { identifier: "element1",
items: []
};
payload = JSON.stringify(dataFields);
data.items.push(payload);
var store = new dojo.data.ItemFileWriteStore({data: data});
the grid does not display anything. Now I know that the grid is set up correctly because when I pass in a JSON file to test my grid it displays the contents of the file without any errors.
I should mention that dataFields is a response of a GET and the entire response is not useful to me that is why I extract the useful fields and put them in a hash map and try to display them. I feel like I am missing something essential here regarding how the data stores work. So I guess, the right question to ask is, how would I setup my data store so that the grid displays my hash map? Or is there a better way to do it than using a hash map?

So it turns out that I did not need to 'stringify' the hash map. I just put in data.items.push(datafields) and it worked. The only reason I was doing it because I thought if I make it a string then it would imitate a JSON object. Turns out I was wrong because JSON text is kind of a hash map.