hello
i have problem with select2, im using ajax and pagination, data not show
$("#tempat_lahir").select2({
allowClear: true,
minimumInputLength:3,
ajax:{
url:url+"/master/wilayah/listSelect",
dataType: "json",
delay: 250,
data: function (params) {
var query ={
search:params.term,
page:params.page||1
}
// Query parameters will be ?search=[term]&page=[page]
return query;
},
processResults: function (data, page) {
return {
results: JSON.parse(data)
};
},
cache: true
}
})
public function listSelect(Request $request){
$page = $request->page;
$term = $request->search;
$wilayah = new wilayah();
$response = $wilayah->select(["ID as id", "DESKRIPSI as text"])
->where("DESKRIPSI", "LIKE", "%".$term."%")
->simplePaginate(10);
return response()->json([
"results" => $response->items(),
"pagination" => [
"more" => $response->hasMorePages()
]
], Response::HTTP_OK);
}
jQuery.Deferred exception: data.slice is not a function TypeError: data.slice is not a function
at HidePlaceholder.removePlaceholder (http://localhost:8000/assets/plugins/global/plugins.bundle.js:21331:29)
at DecoratedClass.removePlaceholder (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17593:32)
at HidePlaceholder.append (http://localhost:8000/assets/plugins/global/plugins.bundle.js:21314:25)
at DecoratedClass.append (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17593:32)
at Select2.<anonymous> (http://localhost:8000/assets/plugins/global/plugins.bundle.js:18109:12)
at Observable.invoke (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17650:20)
at Observable.trigger (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17640:12)
at Select2.trigger (http://localhost:8000/assets/plugins/global/plugins.bundle.js:22934:19)
at http://localhost:8000/assets/plugins/global/plugins.bundle.js:22797:14
at Object.<anonymous> (http://localhost:8000/assets/plugins/global/plugins.bundle.js:20745:9) undefined
You're welcome! I'm glad to hear that you were able to solve the problem by adjusting your code. If you have any more questions or need further assistance, feel free to ask.
Hi,
The error you are seeing indicates a problem with the data format being returned from your server.
Based on the code you provided, it looks like you are returning an array of results along with a pagination object in your JSON response. However, Select2 expects the data to be in a specific format, and it's possible that the format of your response is causing this error.
To resolve this issue, you can try formatting your JSON response as follows:
{
"results": [
{"id": "1113042002", "text": "KUTESANGE"},
{"id": "1214012017", "text": "TESIKHORI"},
// Other data...
],
"pagination": {
"more": true
}
}
hello,
thanks for reply
my json data is correct
i change some code in js file
this is my code
$("#tempat_lahir").select2({
allowClear: true,
minimumInputLength:3,
placeholder:"Tempat Tgl Lahir",
ajax:{
url:url+"/master/wilayah/listSelect",
delay: 250,
dataType:"json",
data: function (params) {
var query ={
_token: CSRF_TOKEN,
search:params.term,
page:params.page||1
}
// Query parameters will be ?search=[term]&page=[page]
return query;
},
processResults: function (data, page) {
console.log(data);
return {
results: data.results,
pagination: {
more: data.pagination
}
};
},
cache: true
}
})
if im update json data like
[{"id":"1113042002","text":"KUTESANGE"},{"id":"1214012017","text":"TESIKHORI"},{"id":"1371061014","text":"GATES NAN XX"},{"id":"1409102012","text":"HULU TESO"},{"id":"1703102023","text":"RETES"},{"id":"1703202007","text":"RETES"},{"id":"1707041002","text":"TES"},{"id":"1802142005","text":"WATES"},{"id":"1804042008","text":"WATES"},{"id":"1806102005","text":"WATES"}]
{"results":[{"id":"1113042002","text":"KUTESANGE"},{"id":"1214012017","text":"TESIKHORI"},{"id":"1371061014","text":"GATES NAN XX"},{"id":"1409102012","text":"HULU TESO"},{"id":"1703102023","text":"RETES"},{"id":"1703202007","text":"RETES"},{"id":"1707041002","text":"TES"},{"id":"1802142005","text":"WATES"},{"id":"1804042008","text":"WATES"},{"id":"1806102005","text":"WATES"}],"pagination":{"more":true}}
plugins.bundle.js:4050 jQuery.Deferred exception: data.slice is not a function TypeError: data.slice is not a function
at HidePlaceholder.removePlaceholder (http://localhost:8000/assets/plugins/global/plugins.bundle.js:21331:29)
at DecoratedClass.removePlaceholder (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17593:32)
at HidePlaceholder.append (http://localhost:8000/assets/plugins/global/plugins.bundle.js:21314:25)
at DecoratedClass.append (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17593:32)
at Select2.<anonymous> (http://localhost:8000/assets/plugins/global/plugins.bundle.js:18109:12)
at Observable.invoke (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17650:20)
at Observable.trigger (http://localhost:8000/assets/plugins/global/plugins.bundle.js:17640:12)
at Select2.trigger (http://localhost:8000/assets/plugins/global/plugins.bundle.js:22934:19)
at http://localhost:8000/assets/plugins/global/plugins.bundle.js:22797:14
at Object.<anonymous> (http://localhost:8000/assets/plugins/global/plugins.bundle.js:20745:9) undefined