如何在MVC kendo treelist编辑器中实现kendo自动完成下拉列表

时间:2018-03-20 15:54:31

标签: asp.net-mvc autocomplete kendo-treelist

Screen

Code

在此屏幕中,我们使用了kendo treelist。我需要在CODE列中实现自动完成下拉列表。我怎么能这样做?

2 个答案:

答案 0 :(得分:0)

试试这个

var ac = Html.Kendo()
        .AutoComplete()
        .Name("CodeAutoComplete")
        .DataSource(ds =>
        {
            ds.Read(read =>
            {
                read.Url("youraction");
            });

            ds.ServerFiltering(true);
        });

    var treeGrid = Html.Kendo()
        .TreeList<YourModel>()
        .Name("SomeTreeList")
        .Columns(columns =>
        {
            columns.Add().Field(t => t.YourProperty).Editor(ac.ToHtmlString());
        });

答案 1 :(得分:0)

我按照以下jquery代码解决了上述问题。

    var input2 = jQuery('<input id="WEIGHT_UOM" value="' + e.model.WEIGHT_UOM + '">');
            input2.appendTo($(".k-grid-edit-row").find("[data-container-for='WEIGHT_UOM']"))
            //create AutoComplete UI component

            $("#WEIGHT_UOM").kendoAutoComplete({
                dataTextField: "ProjectDesc",
                //  template: '${ data.ProjectDesc }' + '<span style="display:none;> ${ data.ProjectDesc }</span>',      
                select: function (org1) {

                    var dataItem1 = this.dataItem(org1.item.index());
                    //   model.set("field1", dataItem.field1);
                    e.model.set("WEIGHT_UOM", dataItem1.ProjectID);

                },
                dataSource: {
                    type: "jsonp",
                    serverFiltering: true,
                    transport: {

                        read: "@Url.Action("GetISOUnitAutoComp",
                         "DashBoard")",
        }
    }
    });