Kendo UI grille avec le modèle de la colonne et de filtrage

J'ai un kendo grille dans laquelle j'ai besoin d'afficher une colonne avec des valeurs concaténées. évidemment, j'ai besoin de choisir une ligne de modèle ou d'un modèle de champ dans les colonnes de l'attribut.

 { title: "StreetID-STREETNAME", filterable: true, template: "#: strID#-#: strName #" },

Mais après l'exécutant ne suis pas en mesure de voir toute icône de filtre sur la colonne de la grille.

Aucune idée ou un lien pour m'aider dans une grande manière. Après beaucoup de R&D, je ne pouvais pas voir des exemples vivants à l'aide de modèle de colonnes avec un filtrage.

InformationsquelleAutor Pavan N | 2014-02-26
  1. 1

    Ce montrer comment vous pouvez personnaliser la grille de filtre.

    http://demos.telerik.com/kendo-ui/web/grid/filter-menu-customization.html

                            {
                            field: "City",
                            width: 130,
                            filterable: {
                                ui: cityFilter
                           }
                        },

            function cityFilter(element) {
                element.kendoDropDownList({
                    dataSource: cities,
                    optionLabel: "--Select Value--"
                });
            }
    • je ne peux utiliser tout type de champ ici coz j'ai besoin de filtre basé sur la chaîne concaténée...
    • Cette réponse ne répond pas à l'exigence, qui est un filtrables modèle, pas filtrable champ.
    InformationsquelleAutor RK911
  2. 1

    vérifier cet exemple de code

    copiez et collez code ci-dessous et enregistrer sous index.html 

    <!DOCTYPE html>
<html>
<head>
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
<style>
.photo {
width: 140px;                    
}
.details {
width: 400px;
}                
.title {
display: block;
font-size: 1.6em; 
}
.description {
display: block;
padding-top: 1.6em;
}
.employeeID {
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
font-size: 50px;
font-weight: bold;
color: #898989;
}
td.photo, .employeeID {
text-align: center;
}
.k-grid-header .k-header {
padding: 10px 20px;
}
.k-grid td {
background: -moz-linear-gradient(top,  rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.15) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.05)), color-stop(100%,rgba(0,0,0,0.15)));
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.15) 100%);
background: -o-linear-gradient(top,  rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.15) 100%);
background: -ms-linear-gradient(top,  rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.15) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.15) 100%);
padding: 20px;
}
</style>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: {   
url: "http://demos.kendoui.com/service/Northwind.svc/Employees"
}
},
schema: {
model: {
fields: {
EmployeeID: { type: "number" },
Title: { type: "string" }
},
id: "EmployeeID"
}
}
},
columns: [
{ field: "Title", width: 400 }, 
{ field: "EmployeeID" }
],
rowTemplate: kendo.template($("#rowTemplate").html()),
height: 430,
filterable: true
});
});</script>
</head>
<body>
<div id="grid"></div>
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr>
<td class="details">
<span class="title">#: Title #</span>
<span class="description">Name : #: FirstName# #: LastName#</span>
<span class="description">Country : #: Country# </span>
</td>
<td class="employeeID">
#: EmployeeID #
</td>
</tr>
</script>
</body>
</html>

    vous avez besoin pour le personnaliser. espérons que cette aide vous

    • Merci pour la réponse. Mais ici, dans ma colonne personnalisée je ne peux pas utiliser un paramètre de champ. parce que la colonne sera lié à particulier champ uniquement si le filtrage. ici, dans mon cas je suis en utilisant une numérique et une colonne de type chaîne. si un paramètre de CHAMP est un peu déroutant.
    InformationsquelleAutor Shivam
  3. 1

    Donc, finalement, j'en ai conclu que comme. si vous avez besoin d'un filtre, vous devez mentionner un CHAMP d'attribut. Il n'y a pas de travail.

    J'ai donc créé une colonne supplémentaire de webservice lui-même et l'envoi d'un supplément de concaténées colonne. Alors maintenant, je suis capable de voir une chaîne de filtre.

    • s'il vous plaît pouvez-vous donner un exemple?
    InformationsquelleAutor Pavan N