Question

我正在使用级联组合框来缩小城市的选择范围。我的方案与http://kendoui.com上提供的示例略有不同，因为我在加载页面后无法进行异步服务器调用。

以下是我的代码示例：

HTML

<p>
    <label for="Country">Country:</label>
    <input id="country"/>
</p>
<p>
    <label for="City">City:</label>
    <input id="city" disabled="disabled" />
</p>

脚本（为简单起见，添加数据源内联）

$("#country").kendoComboBox({
    placeholder: "Select a country...",
    dataTextField: "CountryName",
    dataValueField: "CountryID",
    dataSource: new kendo.data.DataSource({
            data: [
            {
                    CountryID: "1",
                    CountryName: "Sweden"
            },
            {
                    CountryID: "2",
                    CountryName: "Spain"
            }]
    }),
});

$("#city").kendoComboBox({
    autoBind: false,
    cascadeFrom: "country",
    placeholder: "Select city...",
    dataTextField: "CityName",
    dataValueField: "CountryID",
    dataSource: new kendo.data.DataSource({
            data: [
            {
                    CountryID: "1",
                    CityID: "1",
                    CityName: "Stockholm"
            },
            {
                    CountryID: "1",
                    CityID: "2",
                    CityName: "Gothenburg"
            },
            {
                    CountryID: "1",
                    CityID: "3",
                    CityName: "Malmo"
            },
            {
                    CountryID: "2",
                    CityID: "4",
                    CityName: "Madrid"
            }]
    }),
})

这确实有效，在第一个名单中选择'瑞典'将在第二个框中产生斯德哥尔摩，哥德堡和马尔默。但是要求对孩子和父母使用相同的dataValueField，因此当我选择一个城市时，所选的值将是CountryID而不是我想要的CityID。

正确的方法（我猜）应该是在#city中使用dataValueField：CityID并进行客户端选择/过滤类似于:(注意，伪代码）

SELECT CityID, CityName WHERE CountryID EQUALS country.dataValue

当选择城市时，这将从城市组合框中获取正确的dataValue（CityID）。

有谁知道如何解决这个问题？非常感谢任何帮助！

Kendo-UI级联ComboBox客户端过滤

0 个答案: