kendoui grille sélectionnez tous les

Moi, travaillant avec MVC + kendoui grille et c'est mon code:

modèle

      public class User
         {
        [StringLength(9)]       
        public int UserId { get; set; }

        [StringLength(50)]        
        public string UserName { get; set; }

        public bool IsSelected { get; set; }
}

cshtml

@model IEnumerable<PoliciesHaglasha.Models.User>
@{    
Layout = null;
var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
var users = MvcHtmlString.Create(serializer.Serialize(Model));
}
JsonUsers = @users;
var  UsersSource = new kendo.data.DataSource({
pageSize: 5,
data: JsonUsers,            
autoSync: true,
schema: {
model: {
id: "UserId",
fields: {
UserId: { type: "number" ,editable: false, nullable: false },                      
UserName: { type: "string" , editable: false, nullable: false }                     
}
}
}
});     
$("#gridPolisot").kendoGrid({
dataSource: PolisotSource,                        
editable: true,
scrollable: false,
selectable: "row",
sortable: true,            
reorderable: true,           
toolbar: [{ name: "save", text: "save" }],
columns: [ 
{ field:"IsSelected", title: "<input type='checkbox' id='chkSelectAll'>", width: "34px" ,template: "<input  type='checkbox' #= IsSelected ? checked='checked' : '' #/>"},                                    
{ field:"UserId", title: "User Id", width: "20px", attributes: {"class": "KendoUITD"}},
{ field:"UserName",title:"User Name",  width: "50px", attributes: {"class": "KendoUITD"}},              
],         
},                         
});

Mes questions sont:

1) Comment puis-je faire le sélectionner tous les titres de case à cocher pour travailler?

2) Quand j'ai cocher/décocher une case, il sera de retour pour le serveur

Merci,

InformationsquelleAutor Aviv | 2013-12-26
  1. 8

    1) Vous devez utiliser le headerTemplate option de configuration de la grille: 

    headerTemplate: "<input type='checkbox' id='chkSelectAll' onclick='checkAll(this)'/>"

    Puis ajouter le "checkAll" la fonction de la page:

    function checkAll(ele) {
var state = $(ele).is(':checked');
var grid = $('#gridPolisot').data('kendoGrid');
$.each(grid.dataSource.view(), function () {
if (this['IsSelected'] != state) 
this.dirty=true;
this['IsSelected'] = state;
});
grid.refresh();
}

    2) je ne suis pas sûr que je comprends bien ce qu'est exactement que vous essayez d'atteindre, mais si vous avez besoin de synchroniser les changements de la fonction ci-dessus avec le serveur, alors vous pouvez aussi appeler le grille méthode saveChanges.

    • Merci Vladimir, Votre premier exemple fonctionne parfaitement. Et concernant ma deuxième question est: j'ai besoin de mettre à jour la source de données “IsSelected” des biens conformément à l'utilisateur de cocher / décocher la case, Comment dois-je faire? Merci
    InformationsquelleAutor Vladimir Iliev