renat natanael renat natanael - 3 months ago 18x
jQuery Question

create reset value button on select2

im using select2 and try to create a reset button for each select. i have 6 select.

my script is like this

$('.deggre').on('change', function() {
var deggre = $( this ).val();
var span = $("#dropdownMenu1").find('span').clone(); // Copy 'X' span.
$("#dropdownMenu1").text(deggre); // Insert text first.
$("#dropdownMenu1").append(span); // Then, append the 'X' span.
if($(this).val() == "")
$('#dropdownMenu1').css({"display": "none"});//value is none then hide
$('#dropdownMenu1').css({"display": "inline-block"});//have value then show

my script didnt work for this case. how to solve this problem?
i need to show the button when we choose option on select2, and give innerHtml to the button. and then when the button click, its will reset his own select then the button is gone cause it didnt get the value.

heres my jsfiddle


You need to trigger the change


I have updated your fiddle: