Select2 Set Selected Options

Hi Brother,
First of all, I would like to thank you for such a beautiful and stable working theme.

But I'm Having a Little Problem
Below I Share HTML and JS Content, I Fill Content With Ajax

<select class="form-select form-control form-select-solid" data-control="select2" data-placeholder="İşlem Durumu" id="SLC_GonderimBilgisiPencereAlani_IslemDurumu" data-dropdown-parent="#GonderimBilgisiPencereAlani" data-bs-toggle="tooltip" data-bs-placement="bottom"></select>

$('#SLC_GonderimBilgisiPencereAlani_IslemDurumu').select2({
allowClear: true,
ajax: {
url: '/Iletisim/SMS/IslemDurumuListesi_Alan1',
type: 'POST',
dataType: 'json',
delay: 250,
data: function (Deger) {
return {
AramaBilgisi: Deger.term
};
},
processResults: function (GelenVeri) {
return {
results: JSON.parse(GelenVeri)
};
},
cache: true
}
});

The Content Coming From Ajax Is As Below

[{"id":"6","text":"Gönderildi"},{"id":"5","text":"Hazır"},{"id":"7","text":"İptal Edildi"},{"id":"4","text":"Taslak"}]

Here's What I Want To Do In Select2 Fields I Use Single And Multiple, After Filling The Content I Want It To Be Marked As Selected

$('#mySelect2').val('1'); // Select the option with a value of '1'
$('#mySelect2').trigger('change'); // Notify any JS components that the value changed

$('#mySelect2').val(['1', '2']);
$('#mySelect2').trigger('change'); // Notify any JS components that the value changed

I found explanations in this way, but somehow I couldn't do the related operation, it didn't work when I tried,
how can i do this
please support me ?

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)

Hi,

It seems the documentation of Select2 does not clearly explain how to set it for such structure. You can check this discussion and try some of the proposes workarounds. Hope this helps.

Regards.

Hi, Most of my friends confirm that what is described in select2 Documents works, but this does not work in the Metronic theme I described above, I wonder what is preventing it from working?

Hi,

Noted, we will try to double-check it.

In the meantime can you try to remove data-control="select2" from your select2 input and try to initialize it from scratch in your js ? We use a global wrapper in src/js/components/app.js to globally initialize select2 controls with data-control="select2" attribute by createSelect2 function. Other than this we use Select2 as it as, without any core customizations of it's original JS.

Regards.

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(