如何在劍道模板中綁定選擇項值

Question

我有一個帶有下拉列表的kendo模板，並嘗試將所選值設置為該行的值並使用MVVM。 我無法選擇下拉列表中的行。 它已成功將ID放置在文本框中，但未選擇該項...

小提琴： http ： //jsfiddle.net/ooaq5n94/8/

這是我到目前為止所擁有的...

桌子....

 <table class="table table-responsive table-striped">
            <thead>
                <tr>
                    <th>Brand</th>                       
                </tr>
            </thead>
            <tbody data-template="rosterManagementTemplate" data-bind="source: roster.view"></tbody>
        </table>

模板...

<script type="text/x-kendo-tmpl" id="rosterManagementTemplate">
<tr>
    <td>
        <input type="text" data-bind="value: TeamID" />
        <select class="form-control" data-value-field="ID" data-text-field="Name" data-bind="source: teams, value: TeamID"></select>
    </td>        
</tr>

JS ...

<script>   
var rosterViewModel = kendo.observable({      

    roster: new kendo.data.DataSource({
        transport: {
            read: {
                url: "@Url.Action("Read", "Roster")",
                type: "POST",
                data: { 'id': @Model }
            }               
        },           
        type: "aspnetmvc-ajax",
        schema: {
            model: {
                id: "ID"
            }
        }
    }),                
    teams: new kendo.data.DataSource({
        transport: {
            read: {
                url: "@Url.Action("GetTeams", "Lookup")",
                type: "POST",
                data: { 'id': @Model }
            }
        },
        type: "aspnetmvc-ajax",
        schema: {
            model: {
                id: "ID"
            }
        }
    })
});



$(document).ready(function() {
    kendo.bind($("#rosterManagement"), rosterViewModel);        
    rosterViewModel.teams.read();        
    rosterViewModel.roster.read();
});

Answer 1

這是解決方案。 在選擇項HTML內，您需要data-role =“ dropdownlist” 。 而已

因此模板中的代碼應顯示為...

<script type="text/x-kendo-tmpl" id="rosterManagementTemplate">
<tr>
    <td>
        <input type="text" data-bind="value: TeamID" />
        <select class="form-control" data-role="dropdownlist" data-value-field="ID" data-text-field="Name" data-bind="source: teams, value: TeamID"></select>
    </td>        
</tr>
</script>

工作中的小提琴...

http://jsfiddle.net/ooaq5n94/9/