劍道組合框設置

Question

我有一個綁定到的OData數據源的標準劍道網絡組合框。如果您鍵入並獲取正確的文本和值，它看起來很好。

不過，如果你有它的約束，而你在代碼中設置.value的（）屬性，文本沒有得到擡頭對所設置的值。 （如果您正在加載現有數據，則會出現相當標準的行爲）

我假設它已經到服務器，並由dataValueField屬性查找確切的值，並專門返回該項目並設置文本。

如何去使它做到這一點？

Answer 1

讓有以下ComboBox：

var combobox = $("#combobox").kendoComboBox({ 
    dataTextField : "ProductName", 
    dataValueField: "ProductID", 
    dataSource : { 
     type  : "odata", 
     transport: { 
      read: "http://demos.kendoui.com/service/Northwind.svc/Products" 
     } 
    } 
}).data("kendoComboBox"); 

（您可以自己，因爲它是指在劍道UI服務器提供服務使用它）。

然後，您可以使用以下幾段代碼來設置value或text（無論您更喜歡什麼）。

// Set value of the ComboBox using dataValueField (ProductId) 
combobox.value(4); 
// Set value of the ComboBox using dataTextField (ProductName) 
combobox.text("Chef Anton's Cajun Seasoning"); 

以及讀取你應該使用：

alert("Current text/value: " + combobox.text() + "/" + combobox.value()); 

這兩種方法都工作得很好，你可以在這裏http://jsfiddle.net/OnaBai/64gXE/辦理入住手續。

Answer 2

我已經當重新結合劍道組合框這個問題。基本上我不得不重新查詢服務器，就好像用戶鍵入了它。然後一旦查詢完成，我使用先前選擇的值選擇正確的項目。

var comboBoxElem = $("#controlNameHere"); 

comboBoxElem.kendoComboBox(
    { 
     placeholder: "Start typing...", 
     dataTextField: "yourDataTextField",  // field used in the re-query due to 'contains' filter 
     dataValueField: "yourDataValueField", 
     filter: "contains", 
     change: selectFunc, 
     dataSource: { 
      serverFiltering: true, 
      pageSize: 20, 
      transport: { 
       read: { 
        url: "http://yourUrlHere" 
       } 
      } 
     } 
    }); 


// the following code is all about re-selecting the previous value 

var comboBox = comboBoxElem.data('kendoComboBox'); 

var previousTextValue = 'text of the previous entry here'; 
var previousValue = '543'; 

comboBox.text(previousTextValue); // to show the user text while re-query takes place 

// reload previous item(s) from server, then re-select the desired item 

comboBox.dataSource.query({ 
    filter: { operator: "contains", field: 'yourDataTextField', value: previousTextValue }, 
    complete: function() { 
     setTimeout(function() { 
      comboBox.select(function (dataItem) { 
       return dataItem.yourDataValueField == previousValue; 
      }); 
     }, 200); //allow the observable collection to be updated (no event I know of helps here :(
    } 
}); 

希望這已經足夠清晰了，我修改了內聯代碼以保護無辜，因此可能會有絲毫的語法錯誤。

請記住，您在控件的選項（設置）中使用的過濾器應該與用於簡單重新查詢的過濾器相同，否則您將獲得通過服務器的多個過濾器。

Answer 3

你必須在a **中真正踢這個東西來得到它的工作。有一百萬個配置，其中只有少數似乎工作

WebAPI OData實現（4.5）和Telerik Datasource確實不能很好地協同工作。這是我的工作客戶端組合框實現：

$("#dropdownlist").kendoComboBox({ 
        optionLabel: " ", 
        dataTextField: "name", 
        dataValueField: "id", 
        dataSource: { 
         serverFiltering: true, 
         transport: { 
          read: { 
           url: "/odata/MyService", 
           'type': 'Get' 
          } 
         }, 
         schema: { 
          parse: (response: any) => { 
           var results = response.value; 
           var items: any = []; 
           for (var i = 0; i < results.length; i++) { 
            items.push(
             { 
              id: results[i].id, 
              name: results[i].name, 
             }); 
           } 
           return items; 
          }, 
         } 
        } 
       }); 

你會發現，我要劫持在分析方法的數據架構對象和按摩它

我參考的OData響應：