Why the array will not send through the ajax call? - ajax

Question

In my ajax code I'm sending an associative array to the go lang api but go lang would not receiving any array. Why?
for (var i = 1; i <= optionsArr; i++) {
span_arr.push({
day : valueSelected,
time_slug : i,
timing : $("#"+i).text(),
count : $('#select_count'+i).val()
});
}
console.log(span_arr[1].time_slug);
$.ajax({
url:"/api/v1/provider_spot",
type:"POST",
data:{span_arr:span_arr},
dataType:"json",
success:function(response){
console.log(response);
}
});
Why this ajax will not sending the array to the go api?
Here in go lang following mvc structure I want to receiving this data:
Route{"SaveProviderSpot", "POST", "/provider_spot", controller.SaveProviderSpot},
func SaveProviderSpot(c *gin.Context) {
fmt.Println(c.PostForm("span_arr"))
}

Answer 1

You can not send an array directly from client to server,due to the array definition may not be the same in both sides.
Two ways to solve it:
a. You can convert the array into a json string in the clinet,then send it to server as a string parameter,in the server side,you can parse it and convert it to array
b. Iterate the array,and convert it to a string using some special characters,also pass to server as string parameter,an example is as below:
var dataStr = "";
for (var i = 1; i <= optionsArr; i++) {
//each array element split with 3 semicolons,and each property in element split with 2 semicolons
dataStr += valueSelected + ";;" + i + ";;" + $("#"+i).text()
+ ";;" + $('#select_count'+i).val() + ";;;";
}
$.ajax({
url:"/api/v1/provider_spot",
type:"POST",
data:{dataStr:dataStr},
dataType:"json",
success:function(response){
console.log(response);
}
});
//now it is correct