Установить выбор по умолчанию Dropdown с использованием Backbone

Question

Мой вопрос тихий, похожий на set-dropdown-selected-value-with-backbone, с небольшой разницей, что я не хочу манипулировать DOM через jQuery.

Для этого, что я сделал это: -

Предполагая, что мой раскрывающийся типа UserType

var userType = backbone.Model.extend({ 
    idAttribute: "TypeId", 
    defaults: { 
     TypeId: null, 
     TypeName: null, 
     Selected: false 
    } 
}); 

Здесь я создал дополнительный атрибут как Selected, который я использую, как показано ниже в моем Шаблон руля.

<select id="userType" name="UserTypeId" class="input-medium form-control"> 
    {{#each MasterUserType}} 
    <option id="{{TypeId}}" selected="{{Selected}}">{{TypeName}}</option> 
    {{/each}} 
</select> 

Хорошо, теперь, когда я получаю мои данные через API- сказать (пример)

[ 
    { 
     "TypeId":1, 
     "TypeName":"Admin" 
    }, 
    { 
     "TypeId":2, 
     "TypeName":"User" 
    }, 
    { 
     "TypeId":3, 
     "TypeName":"Super Admin" 
    } 
] 

Теперь я манипулировать моей переменной MasterUserType стать то, как показано ниже: -

[ 
    { 
     "TypeId":1, 
     "TypeName":"Admin", 
     "Selected":"" 
    }, 
    { 
     "TypeId":2, 
     "TypeName":"User", 
     "Selected":"selected" 
    }, 
    { 
     "TypeId":3, 
     "TypeName":"Super Admin", 
     "Selected":"" 
    } 
] 

Таким образом, мой HTML-код, который оказывает:

<div class="controls"> 
    <select id="userType" name="TypeId" class="input-medium form-control"> 

     <option id="" selected="">Admin</option> 

     <option id="" selected="selected">User</option> 
     <option id="" selected="">Super Admin</option> 


    </select> 
</div> 

Но все же он отражает первый пункт ....

Может ли кто-нибудь сказать мне, что не так? Или любая другая альтернатива?

И, наконец, можем ли мы достичь этого требования с помощью другого лучшего способа?

Я пробовал заменять «selected with true», но он не работает.

Answer 1

Попробуйте обновить свой шаблон, как показано ниже:

<select id="userType" name="UserTypeId" class="input-medium form-control"> 
     {{#each MasterUserType}} 
     {{#if Selected}} 
      <option id="{{TypeId}}" selected="{{Selected}}">{{TypeName}}</option> 
     {{else}} 
      <option id="{{TypeId}}">{{TypeName}}</option> 
     {{/if}} 
     {{/each}} 
</select>