Comment modifier le format de page de manière dynamique, en Kendo UI Grille

Je vais avoir un Kendo UI grille de plus de 1000 données. Moi aussi j'ai une liste déroulante pour différentes taille de la page - 15, 25, 50, 100. Sur la sélection d'une taille de page, comment pouvons-nous changer la taille de la page de Kendo UI grille?

InformationsquelleAutor Ashmah | 2012-07-04
  1. 17

    Vous pouvez définir la taille de la page dans la zone de liste déroulante modifier l'événement. (Voir aussi JSBin exemple.)

    $("#comboBox").kendoComboBox({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: [
        { text: 1 },
        { text: 2 },
        { text: 3 },
        { text: 4 },
        { text: 5 }
    ],
    change: function(e) {
      var grid = $("#grid").data("kendoGrid");
      grid.dataSource.pageSize(parseInt(this.value()));  //this.value() being the value selected in Combo
    }
});
    • Merci Daniel, votre code n'a travaillé. 🙂
    InformationsquelleAutor Daniel
  2. 21

    Voici la dernière version en utilisant ASP.NET MVC Helper

    .Pageable(pager => pager.PageSizes(new int[] {20, 50, 100})) //Enable paging
    • C'est très bien. Une idée de comment vous pourriez ajouter "Tous"?
    • avez-vous jamais comprendre comment ajouter option 'Toutes'?
    • .Pageable(pager => pager.PageSizes(new int[] { 20, 50, 100, "All" }))
    • L'ajout de "Tous" à un int[] renvoie une erreur. Si j'ajoute 0, il affichera tous les. Je suis encore à essayer de comprendre comment ajouter "Tous" à l'aide de rasoir sans avoir à utiliser des javascript pour le faire.
    • Ah - peut ne peut le faire en javascript... $("#pager").kendoPager({ dataSource: dataSource, pageSizes: [2, 3, 4, "all"] });
    InformationsquelleAutor Rick Glos
  3. 14

    Son également intégré dans la dernière version de la grille de la manière suivante en js

    pageable: {
    pageSizes: [10, 25, 50, 100]
}

    http://docs.kendoui.com/api/web/pager

    InformationsquelleAutor Cragly
  4. 2

    Rick a dit cela dans une bonne manière plus expliqué si on oublie où est-il à faire ici, c'est un morceau de code pour savoir où est-ce qu'on le fasse avec un écran court composant logiciel enfichable

    @(Html.Kendo().Grid(Model)
      .Name("SiteUserGrid")
      .Columns(columns =>
          {
              columns.Bound(u => u.LastName).Title("Last Name");
              columns.Bound(u => u.FirstName).Title("First Name");
              columns.Bound(u => u.UserName).Title("User Name");
              columns.Bound(u => u.EmailAddress).Title("Email Address");
              columns.Bound(u => u.AccessLevel).Title("Access Level");
              columns.Bound(u => u.Status).Title("Status");
              columns.Bound(u => u.UserId).Filterable(f => f.Enabled(false)).ClientTemplate(actionColumnTemplate).Title("Action").Sortable(false).Width(190);
          })
      .Pageable(pageable => pageable.ButtonCount(10))

    .Paginable(pager => pager.PageSizes(new int[] {5,10,15,20,30,50,100}))

          .Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
      .Sortable()
      .Filterable(filterable => filterable
                                    .Extra(false)
                                    .Operators(operators => operators
                                                                .ForString(str => str.Clear()
                                                                                     .StartsWith("Starts with")
                                                                                     .Contains("Contains")
                                                                                     .IsEqualTo("Is equal to")
                                                                ))

    Espère que cette aide

    InformationsquelleAutor Dare Devs
  5. 2

    De s'étendre sur les Rick Glos réponse:

    Vous pouvez définir la Paginable PageSizes à un tableau de générique objets, de sorte que vous pouvez avoir une option "Tous", sans avoir à mettre pageSizes en JavaScript.

    .Pageable(pager => pager.PageSizes(new object[] {20, 50, 100, "All"}))
    InformationsquelleAutor nbrosz
  6. 1

    http://docs.kendoui.com/api/wrappers/php/Kendo/UI/GridPageable

    $pageable = new \Kendo\UI\GridPageable();
$pageable->pageSizes(array(20,50,100));
    InformationsquelleAutor Peter Truong