CODEWITHSUNDEEP
jqueryjquery-chosen
Yuseferi
Yuseferi

Reputation: 8670

chosen not update after select option changes by jquery

I have a hidden(display:none) select option, according to it chosen created,

    <div>
        <select class="fpd-elements-dropdown" style="display: none;">
            <option value="none">None</option>
        <option value="1406378948898">Base</option><option value="1406378949108">Shadow</option></select>
        <div class="chosen-container chosen-container-single fpd-border-color" style="width: 100%;" title="">
        <a tabindex="-1" class="chosen-single"><span>None</span><div><b></b></div></a><div class="chosen-drop">
        <div class="chosen-search"><input type="text" autocomplete="off"></div><ul class="chosen-results"></ul>
        </div>
        </div>
    </div>

Then I want change (select one element(Base) by default) I try below jquery code

//$(' .fpd-elements-dropdown').show();
 $('.fpd-elements-dropdown option:contains(Base)').prop('selected','selected');
//$('.fpd-elements-dropdown').val($('.fpd-elements-dropdown option:contains(Base)').val());  
$('.chosen-container-single').trigger('chosen:updated');

select option changed but chosen not changed also I try 

$('.chosen-container-single').trigger("liszt:updated");

but chosen selected Item not changes

Upvotes: 0

Views: 11289

Answers (1)

Yuseferi
Yuseferi

Reputation: 8670

I found my mistakes

$('.fpd-elements-dropdown option:contains(Base)').prop('selected','selected');
$('.chosen-container-single').trigger('chosen:updated');

I should trigger('chosen:updated') on .fpd-elements-dropdown instead `.chosen-container-single.

So

$('.fpd-elements-dropdown option:contains(Base)').prop('selected','selected');
$('.fpd-elements-dropdown').trigger('chosen:updated');

work correctly

Upvotes: 6

Related Questions