如何用動態命名的事件函數創建kendoComboBox？

比方說，我有一個Java腳本來添加動態創建kendoComboBox如何用動態命名的事件函數創建kendoComboBox？

與類型的文本或隱框的佔位符HTML的輸入被預先用ID = CBID，其中CBID是分配給HTML文本輸入框的ID創建。

var cbId = "comboBoxId"; 
<input type="hidden" id="\" + cbId + "\" />

然後佔位符輸入文本元素被轉換成由kendoComboBox調用此函數：

function OP_createComboBox(cbId, placeholder, dataTextField, dataValueField, dataSource, selectFunction) { 
    console.log(" * Creating non-cascading ComboBox..."); 
    $("#" + cbId).kendoComboBox({ 
     Name: cbId, 
     id: cbId, 
     placeholder: placeholder, 
     dataTextField: dataTextField, 
     dataValueField: dataValueField, 
     filter: "contains", 
     suggest: true, 
     dataSource: dataSource, 
     select: onFubarSelect 
     }); 
}

當在組合框選擇了項目時，onFubar功能獲取與一個事件參數調用。說出onFubar函數定義如下：

function onFubarSelect(e) { 
    console.log("== onFubarSelect(e=>%o<=) STARTS!! ==", e); 
    console.log("* e.item.index()=>%o<=", e.item.index()); 
    var dataItem = this.dataItem(e.item.index()); 
    console.log("* dataItem=>%o<=", dataItem); 
    OP_consoleLog("* dataItem.<dataTextField>=>%o<=", dataItem.<dataTextField>); 

    //do more logic based upon the values of <dataTextField> and <dataValueField> 

    OP_consoleLog("== onFubarSelect() ENDS =="); 
}

當頁面讀取器和一個項目從kendoComboBox選中，onFubarSelect被調用和的console.log（「*的DataItem =>％氧氣< =」，數據項）;將打印出的東西simular這樣：

（下面的「VV」表示「擴展對象」向下箭頭，和「>>」代表「未膨脹的對象」右箭頭）

== onFubarSelect(e=> VV Object 
            _defaultPrevented: false 
            >> isDefaultPrevented:() 
            >> item: R.fn.init[1] 
            >>preventDefault:() 
            >>sender: init 
            >>__proto__: Object<=) STARTS!! 
<= STARTS!! == 

* e.item.index()=>1<= 

* dataItem=> VV init           <=  
       <dataValueField>: "35dcffc5-e31d-4c60-ac41-31417a700d3b" 
       <dataTextField>: "The Value associated with the above Guid" 
       >>_events: Object 
       >>_handlers: Object 
       >>parent:() 
       uid: "f1f1b5c1-f155-40c3-8f69-d9b4a960ac15" 
       >>__proto__: init 

* dataItem.<dataTextField>=>"The Value associated with the above Guid"<= 

== onFubarSelect() ENDS ==

上面是期望的行爲。

到目前爲止一切順利。但我不想選擇參數硬編碼到onFubarSelect：

$("#" + cbId).kendoComboBox({ 
    Name: cbId, 
    ... 
    select: onFubarSelect 
    });

而是我要動態地設置。

我試圖像下面，但它報告「遺漏的類型錯誤：R N] .CALL不是一個函數」 ......

var selectFunction = "onFubarSelect"; 

$("#" + cbId).kendoComboBox({ 
    Name: cbId, 
    ... 
    select: selectFunction 
    });

然後我嘗試類似如下：

var selectFunction = "onFubarSelect"; 

$("#" + cbId).kendoComboBox({ 
    Name: cbId, 
    ... 
    function (e) { window[selectFunction](e); } 
    });

凡selectFunction被調用，但 'this.dataItem' 給出了一個錯誤：

== onFubarSelect(e=> VV Object 
            _defaultPrevented: false 
            >> isDefaultPrevented:() 
            >> item: R.fn.init[1] 
            >>preventDefault:() 
            >>sender: init 
            >>__proto__: Object<=) STARTS!! 
<= STARTS!! == 

* e.item.index()=>1<= 

>> Uncaught TypeError: this.dataItem is not a function 
     at onFubarSelect 
     ... 
     rest of stack trace 
     ...

我也試過：

... 
select: select: function (e) { eval(selectFunction + "(e)"); } 
...

其中也打帶參數的功能，但再次離開「this.dataItem」用同「this.dataItem不是一個函數」的錯誤。

那麼我該如何動態地設置select事件，以便保留「this.dataItem」？

來源

2017-01-16 Paul Gorbas

聽起來像你需要的是call方法。它允許你定義執行一個函數時什麼是this。閱讀關於它here。

來源

2017-01-16 08:33:42 Shai

我找到工作什麼是使用下面我選擇操作：

var selectFunction = "onFubarSelect"; 

... 
$("#" + cbId).kendoComboBox({ 
    Name: cbId, 
    ... 
    select: function (e) { 
     var dataItem = this.dataItem(e.item.index()); 
     window[selectFunction](dataItem);    
    } 
});

... ... ...

function onFubarSelect(dataItem) { 
    console.log("== onFubarSelect(dataItem=>%o<=) STARTS!! ==", dataItem); 
    //do more logic based upon information in dataItem... 
}

來源

2017-01-16 21:48:23

如何用動態命名的事件函數創建kendoComboBox？

回答

相關問題