Question

如何使用kendo ui和angular js在dropddownlist上设置默认选择？我尝试使用k值，但它不起作用。我使用角1.5和es6。我想显示一个用户列表，每个用户都有一个id。谢谢！

<select kendo-drop-down-list="vm.dpwnN1"
        class="col s5"
        id="idUtilisateurResponsableN1"
        name="idUtilisateurResponsableN1"
        k-options="vm.responsableN1Options"
        k-value="vm.utilisateur.id_utilisateur_responsable_n1"
        ng-model="vm.utilisateur.id_utilisateur_responsable_n1"
        >
</select>

this.responsableN1Options = {
      dataSource: {
        transport: {
          read: promise => {
            this.getDataForN1(promise);
          }
        }
      }, dataBound: () => {
        this.utilisateur.id_utilisateur_responsable_n1 = this.dpwnN1.value();
      },
      optionLabel: 'Choisissez votre responsable (N+1)',
      dataTextField: 'nom',
      dataValueField: 'id',
      template: '{{dataItem.nom}} {{dataItem.prenom}}',
      valueTemplate: 'Responsable (N+1) : {{dataItem.nom}} {{dataItem.prenom}}',
      animation: {
        close: {
          effects: 'fadeOut zoom:out',
          duration: 300
        },
        open: {
          effects: 'fadeIn zoom:in',
          duration: 300
        }
      }
    };

Answer 1

您可以使用“value”配置选项设置DropDownList的默认值：

http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#configuration-value

所以在你的情况下你会使用：

   this.responsableN1Options = {
      dataSource: {
        transport: {
          read: promise => {
            this.getDataForN1(promise);
          }
        }
      }, dataBound: () => {
        this.utilisateur.id_utilisateur_responsable_n1 = this.dpwnN1.value();
      },
      optionLabel: 'Choisissez votre responsable (N+1)',
      dataTextField: 'nom',
      dataValueField: 'id',
      value: vm.utilisateur.id_utilisateur_responsable_n1,
      template: '{{dataItem.nom}} {{dataItem.prenom}}',
      valueTemplate: 'Responsable (N+1) : {{dataItem.nom}} {{dataItem.prenom}}',
      animation: {
        close: {
          effects: 'fadeOut zoom:out',
          duration: 300
        },
        open: {
          effects: 'fadeIn zoom:in',
          duration: 300
        }
      }
    };

我在“dataValueField”选项后插入“value”。

Answer 2

您可以使用jQuery执行此操作，添加以下脚本：

<script>
$(document).ready(function(){
 var dropdownList = $("#idUtilisateurResponsableN1").data("kendoDropDownList"); 
 dropdownList.select(0); // in this case first option will be default value.
})    
</script>

kendo ui下拉列表默认值

2 个答案: