This is what I am using: $(“#search_code”).live(‘change’, function(){ alert(this.value) }); For latest jQuery users, this one should work: $(document.body).on(“change”,”#search_code”,function(){ alert(this.value); });
If jQuery 3.6.0 is causing this you can use this: $(document).on(‘select2:open’, () => { document.querySelector(‘.select2-search__field’).focus(); });
You don’t require a timeout to make this work, here’s my example: $(‘#my-select’).select2({ allowClear: true }).on(‘select2:unselecting’, function() { $(this).data(‘unselecting’, true); }).on(‘select2:opening’, function(e) { if ($(this).data(‘unselecting’)) { $(this).removeData(‘unselecting’); e.preventDefault(); } });
$(‘#select_id’).val(‘val’).trigger(‘change’); is the right way, see here
This is Solution for Latest select2 (Tested With 4.0.7) using css only /*Select2 ReadOnly Start*/ select[readonly].select2-hidden-accessible + .select2-container { pointer-events: none; touch-action: none; } select[readonly].select2-hidden-accessible + .select2-container .select2-selection { background: #eee; box-shadow: none; } select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear { display: none; } /*Select2 ReadOnly End*/
In onload: $.each(data, function(index, value) { $(‘#selectId’).append( ‘<option value=”‘ + data[index].id + ‘”>’ + data[index].value1 + ‘</option>’ ); });
If you set the debug property to true you’ll see a warning message. The allowClear option should be used in combination with the placeholder option. <!DOCTYPE html> <html> <head> <title></title> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″> <script src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js”></script> <link href=”https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css” rel=”stylesheet” /> <script src=”https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js”></script> </head> <body> <select role=”select” id=”myoption”> <option value=”001″>abcs </option><option value=”002″>dshdsh</option><option value=”003″>A</option> <option value=”004″>ANAM CO</option> … Read more
You can set the allowClear option to true. $(“#e6”).select2({ allowClear: true, placeholder: “Search for a movie”, … When set to true, the allowClear option causes the Select2 control to display a clear button, but you must also specify the placeholder option for it to work. Here’s a jsfiddle showing it work for a Select2 that … Read more
There is no direct method with select2, you can use a combination of select2 data and jQuery like following : $(“#example”).select2().find(“:selected”).data(“id”); First you get the select2 data then you find your selected option with jQuery and finally the data-attribute.
Maybe this work for you!! This works for me… initSelection: function (element, callback) { callback({ id: 1, text: ‘Text’ }); } Check very well that code is correctly spelled, my issue was in the initSelection, I had initselection