Select2 初始值不起作用
Select2 initial value not working
我正在为 CRUD 页面使用 Select2 4.0.2。但是,当我尝试 fill/initialize edit
页面中的 selectbox
时,由于某种原因它不起作用。为什么它不起作用?这是我现在拥有的示例,它应该填写电子邮件地址 test@gmail.com。 https://gyazo.com/92a89f5462c36a8c26f4dcd365fb1fb9
它应该是这样的,但我没有让它工作:https://gyazo.com/194fa8b11a61736039a5acda763065ae
<script>
token = '{{csrf_token()}}';
$("#mainuser").select2({
ajax: {
dataType: "json",
type: "POST",
data: function (params) {
return {
term: params.term,
'_token': token,
isnew: 'false',
partner_id: {{$partner->id}}
};
},
url: '/partners/getusers',
cache: false,
processResults: function (data) {
return {
results: data
};
}
},
"language": {
"noResults": function () {
return "Geen gebruikers gevonden.<br> <a href='/klanten/nieuw' class='btn btn-danger'>Maak nieuwe klant</a>";
}
},
escapeMarkup: function (markup) {
return markup;
}
});
$("#mainuser").select2('data', {id: 1, text: 'test@gmail.com'});
// $("#mainuser").select2({...}).select2('data', {...}); doesn't work either...
</script>
我现在所拥有的是按预期由 AJAX 填充的选择框,但没有被填充(因为它应该在 edit
页面中)。它应该已经被 `.select2('data', {id:... text: ...}); 填充了。部分但它没有被这个值填充,正如你在视频中看到的那样,它仍然是空白的。我已阅读 this 文章,但它不起作用。
找到解决方案:
<script>
token = '{{csrf_token()}}';
var select = $('#mainuser');
select.select2({
ajax: {
dataType: "json",
type: "POST",
data: function (params) {
return {
term: params.term,
'_token': token,
isnew: 'false',
partner_id: {{$partner->id}}
};
},
url: '/partners/getusers',
cache: true,
processResults: function (data) {
return {
results: data
};
}
},
"language": {
"noResults": function () {
return "Geen gebruikers gevonden.<br> <a href='/klanten/nieuw' class='btn btn-danger'>Maak nieuwe klant</a>";
}
},
escapeMarkup: function (markup) {
return markup;
}
});
var $option = $('<option selected>Loading...</option>').val(1);
select.append($option).trigger('change'); // append the option and update Select2
$.ajax({ // make the request for the selected data object
type: 'POST',
url: '/partners/getmainuser',
dataType: 'json',
data : { '_token': token, 'isnew' : 'false'},
headers:
{
'X-CSRF-Token': '{{csrf_token()}}'
}
}).then(function (data) {
// Here we should have the data object
$option.text(data.text).val(data.id); // update the text that is displayed (and maybe even the value)
$option.removeData(); // remove any caching data that might be associated
select.trigger('change'); // notify JavaScript components of possible changes
});
</script>
有点不幸,必须使用完全不同的 AJAX 调用进行初始化,但这似乎是唯一的选择。
我正在为 CRUD 页面使用 Select2 4.0.2。但是,当我尝试 fill/initialize edit
页面中的 selectbox
时,由于某种原因它不起作用。为什么它不起作用?这是我现在拥有的示例,它应该填写电子邮件地址 test@gmail.com。 https://gyazo.com/92a89f5462c36a8c26f4dcd365fb1fb9
它应该是这样的,但我没有让它工作:https://gyazo.com/194fa8b11a61736039a5acda763065ae
<script>
token = '{{csrf_token()}}';
$("#mainuser").select2({
ajax: {
dataType: "json",
type: "POST",
data: function (params) {
return {
term: params.term,
'_token': token,
isnew: 'false',
partner_id: {{$partner->id}}
};
},
url: '/partners/getusers',
cache: false,
processResults: function (data) {
return {
results: data
};
}
},
"language": {
"noResults": function () {
return "Geen gebruikers gevonden.<br> <a href='/klanten/nieuw' class='btn btn-danger'>Maak nieuwe klant</a>";
}
},
escapeMarkup: function (markup) {
return markup;
}
});
$("#mainuser").select2('data', {id: 1, text: 'test@gmail.com'});
// $("#mainuser").select2({...}).select2('data', {...}); doesn't work either...
</script>
我现在所拥有的是按预期由 AJAX 填充的选择框,但没有被填充(因为它应该在 edit
页面中)。它应该已经被 `.select2('data', {id:... text: ...}); 填充了。部分但它没有被这个值填充,正如你在视频中看到的那样,它仍然是空白的。我已阅读 this 文章,但它不起作用。
找到解决方案:
<script>
token = '{{csrf_token()}}';
var select = $('#mainuser');
select.select2({
ajax: {
dataType: "json",
type: "POST",
data: function (params) {
return {
term: params.term,
'_token': token,
isnew: 'false',
partner_id: {{$partner->id}}
};
},
url: '/partners/getusers',
cache: true,
processResults: function (data) {
return {
results: data
};
}
},
"language": {
"noResults": function () {
return "Geen gebruikers gevonden.<br> <a href='/klanten/nieuw' class='btn btn-danger'>Maak nieuwe klant</a>";
}
},
escapeMarkup: function (markup) {
return markup;
}
});
var $option = $('<option selected>Loading...</option>').val(1);
select.append($option).trigger('change'); // append the option and update Select2
$.ajax({ // make the request for the selected data object
type: 'POST',
url: '/partners/getmainuser',
dataType: 'json',
data : { '_token': token, 'isnew' : 'false'},
headers:
{
'X-CSRF-Token': '{{csrf_token()}}'
}
}).then(function (data) {
// Here we should have the data object
$option.text(data.text).val(data.id); // update the text that is displayed (and maybe even the value)
$option.removeData(); // remove any caching data that might be associated
select.trigger('change'); // notify JavaScript components of possible changes
});
</script>
有点不幸,必须使用完全不同的 AJAX 调用进行初始化,但这似乎是唯一的选择。