Come disattivare il paging su un kendogrid

Question

Stiamo usando una griglia Kendo. Ho creato una tabella nel mio file cshtml e nel mio file js, la lego ai dati. Il mio problema qui è che il paging della rete non scompare. Ho bisogno di tutti gli articoli sulla pagina poiché non ci aspettiamo molto carico. Ho provato a rimuovere l'attributo pageable e ho provato a contrassegnare pageable: false. Ma vedo ancora che la griglia visualizza solo 10 elementi in una pagina e fornisce il paging.

Utilizzando this.pager.element.hide(), è possibile nascondere il cercapersone ma questo non risolve lo scopo poiché il cercapersone è nascosto ma il paging è ancora in corso. Quindi, ora, gli elementi che iniziano l'undicesimo elemento sono nella pagina successiva, ma non saremo in grado di navigare ad esso.

Ecco il codice esistente. Ho rimosso le colonne irrilevanti nella tabella. .CSHTML File:

<table style="width: 100%;" class='list-entity' id='inboxItems'> 
       <thead> 
        <tr> 
         <th data-field='Actions' class="iconCell" style='width: 1%'>&nbsp;</th> 
         <### THERE ARE MORE COLUMNS HERE AND THOSE HAVE CORRESPONDING COLUMNS IN SETTINGS ###>  
        </tr> 
       </thead> 
      </table> 

JS File:

var settings = { 
     kendosettings: { 
      dataSource: { 
       data: requestItemsList, 
       schema: { 
        // required if get method will be used 
        model: { 
         id: "StepApproverKey" 
        } 
       }, 
       group: [ 
        { 
         field: "GroupByAttribute", 
         dir: "asc", 
         aggregates: 
         [ 
          { field: "GroupByAttribute", aggregate: "count" }] 
        }] 
      }, 
      sort: { field: "SubmittedOn", dir: "desc" }, 
      sortable: true, 
      pageable: false, 
      scrollable: false, 
      columns: [ 
       { 
        field: "Actions", 
        title: "Actions", 
        template: kendo.template($("#inboxrowEditTemplate").html()) 
       }, 
       { field: "StepApproverKey", hidden: true }, 
       { 
        field: "GroupByAttribute", 
        hidden: true, 
        groupHeaderTemplate: kendo.template($("#inboxrowgroupHeaderTemplate").html()), 
        headerAttributes: { 
         style: "width: 100%" 
        } 
       } 
      ], 
      selectable: "row", 
     } 
    }; 
    $('#inboxItems').pdi().displaygrid(settings); 

Answer 1

ho postato sul forum Kendo e sembra l'unico modo in cui possiamo risolverlo è quello di impostare dinamicamente la dimensione della pagina della griglia e poi nascondi il cercapersone. Nel nostro caso, dal momento che desideriamo tutti gli articoli a carico singolo, lo impostiamo sulla lunghezza della lista che viene inviata al client. Di seguito è riportato il codice che ho usato e funziona.

var inboxGrid = $('#inboxItems').data("kendoGrid"); 
inboxGrid.dataSource.pageSize(<NUMBER OF ITEMS IN THE LIST>); 
inboxGrid.refresh(); 
inboxGrid.bind("dataBound", function() { 
       this.pager.element.hide(); 
     }); 

Answer 2

Usando:

inboxGrid.bind("dataBound", function() { 
      this.pager.element.hide(); 
    }); 

non ha funzionato per me. Forse perché sto usando Razor e MVC per visualizzare la griglia, o forse perché stiamo usando Bootstrap per il CSS, non lo so. Ma così ho fatto questo, invece:

var inboxGrid = $('#inboxItems').data("kendoGrid"); 
inboxGrid.dataSource.pageSize(inboxGrid.dataSource.total()); 
inboxGrid.refresh(); 
$('[class*="k-pager-nav"]').hide();