通过传输更新kendo dataSource

时间:2013-11-18 19:38:41

标签: javascript kendo-ui kendo-combobox kendo-dropdown

我正在尝试根据另一个下拉列表(cboSearchString1DDL.element [0] .value)中的选定值设置远程数据URL。我继续学习Kendo Web控件,所以我不确定如何最有效地完成此任务。我尝试了几个途径,但在读取dataSource时仍然出现错误。我正试图将它设置为DDL1。这就是我所处的位置,我知道这不是正确的方法:

// search string 1 DDL
var cboSearchString1DDL = $("#cboSearchString1DDL").kendoDropDownList({
    autoBind: false,
    optionLabel: " "
}).data("kendoDropDownList");

// search string 2 DDL
var cboSearchString2DDL = $("#cboSearchString2DDL").kendoDropDownList({
    autoBind: false,
    optionLabel: " "    
}).data("kendoDropDownList");

// 1st DDL dataSource                   
var dataSourceTowns = new kendo.data.DataSource({                   
    transport: {       
       read: {
           url: _urlTowns,
           dataType: "json",
        }
    },
    schema: {
        data: "Towns"
    }
});

$("#cboSearchString1DDL").data("kendoDropDownList").wrapper.show();

// 1st DDL                               
var townsDDL = $("#cboSearchString1DDL").kendoDropDownList({
    autoBind: false,
    dataTextField: "Column1",
    dataValueField: "Column1",
    dataSource: dataSourceTowns,
    close: function () {
        alert(cboSearchString1DDL.element[0].value);
        streetsDDL.enable(true);
        streetsDDL.setDataSource(dataSourcestreetsDDL);
        streetsDDL.refresh();
    }
}).data("kendoDropDownList");

// show 2nd DDL 
$("#cboSearchString2DDL").data("kendoDropDownList").wrapper.show();
cboSearchString2DDL.enable(false);

// 2nd DDL datasource 
var dataSourcestreetsDDL = new kendo.data.DataSource({
    transport: {
        read: {
            url: _urlSOESearchAddress + "townName=" + cboSearchString1DDL.element[0].value + "&f=",
        dataType: "json",
        },
    },
    schema: {
        data: "StreetsinTown"
    }
});

// 2nd DDL
var streetsDDL = $("#cboSearchString2DDL").kendoDropDownList({
    autoBind: false,
    dataTextField: "Street",
    dataValueField: "Street",
    requestStart: function (e) {
        console.log("request started");
    },
    requestEnd: function (e) {
        var response = e.response;
        var type = e.type;
        console.log(type);
        console.log(response.length);
    }
}).data("kendoDropDownList");

提前致谢!

2 个答案:

答案 0 :(得分:1)

请记住,url可以是将URL作为字符串返回的函数。因此,如果编码更容易,您也可以执行以下操作:

var dataSourcestreetsDDL = new kendo.data.DataSource({
    transport: {
        read: {
            url: function () {
                var searchAddress = ...;
                var searchString = ...;
                return searchAddress + "townName=" + searchString + "&f=";
            }
        ...

只要数据源需要读取数据,就会调用该函数。当下拉菜单关闭时,它可能比更改内容更容易。

答案 1 :(得分:0)

$("#cboSearchString1DDL").kendoDropDownList({

被调用两次。第二次它被称为它可能会消除这里设置的变量:

var cboSearchString1DDL = $("#cboSearchString1DDL").kendoDropDownList({

如果要在元素上多次初始化组件,通常使用kendo,您需要执行.destroy()以干净地执行此操作。我甚至不确定这是你想要做的事情。