Anuja P
Anuja P

Reputation: 2143

Angular js + Chosen Plugin + Set the value as Selected in dropdown

I have implement the chosen plugin in the Angular.js with the reference of this link

I am able to fetch the value, Now I want to the selected value as pre selected in the chosen dropdown.

Can any one tell me the easy way to do this. Sample Code :

<select  name="SelectedName" id="SelectedName" data-placeholder="Choose a Name..." chosen 
        ng-model="Info.SelectedNameModel" 
        ng-options="jd.Name for jd in Info.List" 
        class="form-control chosen-select"></select>

In Js code

.directive('chosen', function() {
    var linker = function (scope, element, attr) {
        // update the select when data is loaded
        scope.$watch('Info.List', function (oldVal, newVal) {
            element.trigger('chosen:updated');
        });

        element.chosen();
    };

    return {
        restrict: 'A',
        link: linker
    };
});

Sample list : {"Name":"PQR"},{"Name":"LMN"}

In Database I am storing the only value as 'LMN'

So when the dropdown loads I want to show as LMN selected.

Let me know If any one has already done this.

Upvotes: 0

Views: 2248

Answers (1)

Anuja P
Anuja P

Reputation: 2143

Updated the ng-options as jd.Name for jd in Info.List track by jd

You can change into this:

<select  name="SelectedName" id="SelectedName" data-placeholder="Choose a Name..." chosen 
        ng-model="Info.SelectedNameModel" 
        ng-options="jd.Name for jd in Info.List track by jd" 
        class="form-control chosen-select"></select>

Upvotes: 1

Related Questions