Comment faire pour que la liste déroulante de Kendo soit insensible à la casse

Question

Je veux définir une valeur à une liste déroulante de kendo, quel que soit son cas.

Pour un exemple, le code suivant fonctionne correctement.

$ ("# color"). Data ("kendoDropDownList"). Value ("Gray");

je en ai besoin de travailler pour le code suivant aussi:

$ valeur ("# couleur") des données ("kendoDropDownList") ("gris");..

(function() { 
 
    var data = [{ 
 
    text: "Black", 
 
    value: "Black" 
 
    }, { 
 
    text: "Orange", 
 
    value: "Orange" 
 
    }, { 
 
    text: "Grey", 
 
    value: "Grey" 
 
    }]; 
 

 
    // create DropDownList from input HTML element 
 
    $("#color").kendoDropDownList({ 
 
    dataTextField: "text", 
 
    dataValueField: "value", 
 
    dataSource: data, 
 
    index: 0 
 
    }); 
 

 
    var color = $("#color").data("kendoDropDownList"); 
 
    color.value("Grey"); 
 
})();

<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.common.min.css" rel="stylesheet" /> 
 
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.default.min.css" rel="stylesheet" /> 
 
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.all.min.css" rel="stylesheet" /> 
 
<script src="https://kendo.cdn.telerik.com/2016.2.504/js/kendo.all.min.js"></script> 
 

 
<input id="color" value="1" style="width: 100%;" />

S'il vous plaît voir le violon pour une meilleure compréhension: https://jsfiddle.net/Hd47F/329/

Answer 1

En regardant les documents, il est logique que cela ne fonctionne pas comme on pouvait s'y attendre. Vous essayez de définir la valeur, pas de filtrer la liste déroulante. La propriété ignoreCase s'applique uniquement au filtrage et la définition de la valeur requiert l'observation exacte de ce que je peux voir. Au lieu d'utiliser value() pour définir la valeur, essayez d'utiliser search() comme ci-dessous.

$("#color").kendoDropDownList({ 
    dataTextField: "text", 
    dataValueField: "value", 
    dataSource: data, // using your same data as above 
    index: 0 
    }); 

var color = $("#color").data("kendoDropDownList"); 
color.search("grey"); // This now works regardless of casing 

Vous pouvez voir mon exemple ici: http://dojo.telerik.com/ewEyoC