remove quotation marks from jquery array - php

Question

In my function I search with jquery all items of a owl carousel and take from the id only the available numbers. Because I only need the ID numbers of the items. I send the ID numbers via ajax to my php controller for further processing.
var slideArray = $('#categoryInterestCarousel_' + categoryIdOld).find('.interestOwl');
//Step 1: initialize the array
var previewIds = [];
//Step 2: Search for all IDs and add only the id to the array
$(function() {
$(slideArray).each(function(index) {
previewIds[index] = $(this).attr('id').replace(/\D/g, '');
});
});
As output I get the following array:
array:3 [
0 => "183"
1 => "198"
2 => "201"
]
I need the array without quotation marks, which it looks like:
array:3 [
0 => 183
1 => 198
2 => 201
]
Send data via ajax:
$.ajax({
type: 'GET',
url: '/categorie/owl/' + categoryIdOld,
data: {
previewIds: previewIds
},
success: function(data) {
//add some data to view
},
error: function(xhqr, staus, message) {
var response = JSON.parse(xhqr.responseText);
var errors = response.errors;
for (var error_key in errors) {
var error = errors[error_key];
_toastr_new(error, "top-full-width", "error", false, '.toastr-notify', 0);
}
}
});
get data on Controller:
public function ajaxOwlItems(Request $request, $id) {
$preview_id = $request->previewIds;
dd($request->previewIds);
}
Where's my mistake? How can I remove the quotation marks?

Answer 1

Like this - you need to cast the string to number - I use +
I took the liberty to streamline the code too - for example no need to use $(slideArray) since it is already a jQuery collection.
let categoryIdOld =3;
const previewIds = $('#categoryInterestCarousel_' + categoryIdOld)
.find('.interestOwl')
.map(function() { return +this.id.replace(/\D/g, ''); })
.get();
console.log(previewIds);
console.log(JSON.stringify(previewIds)); // still numeric
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="categoryInterestCarousel_3">
<span class="interestOwl" id="x183"></span>
<span class="somethingElse" id="x999"></span>
<span class="interestOwl" id="x198"></span>
<span class="interestOwl" id="x201"></span>
</div>

Answer 2

Just add parseInt() around the value:
$(function() {
$(slideArray).each(function(index) {
previewIds[index] = parseInt($(this).attr('id').replace(/\D/g, ''), 10);
});
});