1

我正在使用 Kendo UI Grid，并且已将其配置为使用带有自定义模板的弹出编辑

    <script id="popup_editor" type="text/x-kendo-template">
    <div id="editor">
            <div class="k-edit-label">
                <label for="Type">Type</label>
            </div>

    <select data-role="dropdownlist" data-value-field="Type" data-text-field="Type"
                         data-bind="source: typeSource, value: selectedProduct"></select>

<div class="k-edit-label">
                <label for="Type">Option</label>
            </div>

<select data-role="dropdownlist" data-value-field="Option" data-text-field="Option"
                         data-bind="source: productsSource.Options, value: selectedOption"></select>
            </div>

</script>

这是我的视图模型：

    function ViewModel() {
        var getTypesUrl = "/Controller/Action";

        var viewModel = kendo.observable({
            typeSource: new kendo.data.DataSource({
                transport: {
                    read: {
                        url: getConditionTypesUrl,
                        dataType: "json"
                    },
                },
                batch: true,
                schema: {
                    model: {
                        id: "Type"
                    }
                }
            }),
            selectedType: null,
            selectedOption: null
        });

        kendo.bind($("#editor"), viewModel);
    }

ViewModel();

我的操作返回 JSON。

问题是当我点击“添加新记录”按钮时，没有调用getTypesUrl并且下拉列表没有填充。一般的想法是为不同的类型提供不同的选项，并根据所选类型填充选项下拉列表。我相信，之所以会出现问题，是因为仅在单击按钮时才显示编辑器并且剑道无法创建绑定。

4

1 回答 1

1

如果每一行的下拉列表都相同，则从数据源获取其值并将这些值存储在 JavaScript 页面中的变量中，并将下拉列表指向这个新数据源。使用一些 JavaScript 来关联 id 和 name。

或者，如果这是基于其他逻辑加载的，则实现单独的调用以填充视图模型中下拉列表的数据源。

http://www.aspnetwiki.com/page:introduction-to-kendo-mvvm

http://www.aspnetwiki.com/page:kendo-mvvm-ui-grid

进一步注意，您可以纯粹用 JavaScript 编写模板并将其绑定到 html，这样做的好处是您可以调试它，并且以后仍然可以通过 ajax 调用加载它，而且它可能会更小。

于 2013-03-19T02:53:20.643 回答