我有一个带有下拉列表的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();
});
答案 0 :(得分:0)
这是解决方案。在选择项目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>
工作小提琴......