2012-11-18 10 views
5

Ich arbeite an einem MVC4 Projekt, wo ich ein Kendo Grid verwende. Ich möchte, dass der Benutzer die erste Zeile des standardmäßig ausgewählten Gitters sieht. Ich habe viele Zeilen, also benutze ich Paging. Wenn der Benutzer zu Seite 2,3, ... 40 usw. geht, möchte ich auch die erste Reihe jeder ausgewählten Seite sehen. Unten ist mein Code, wo ich das GitterImmer die erste in Kendo ausgewählte Zeile anzeigen Raster

<%: Html.Kendo().Grid(Model) 
      .Name("AuthorisationsGrid") 
      .Columns(columns => 
      { 
       columns.Bound(p => p.Mis).Title("MIS").Width(80); 
       columns.Bound(p => p.AuthorisationSerialNumber).Title("ΑΑ Προέγκρισης"); 
      }) 
      .Pageable() 
      .Sortable() 
      .Filterable() 
      .Selectable(s => s.Mode(GridSelectionMode.Single)) 
      .Resizable(resize => resize.Columns(true)) 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .ServerOperation(false) 
       .Model(model => model.Id(p => p.AuthorisationSerialNumber)) 
       .Model(model => model.Field(p => p.Mis)) 
       .Batch(true) 
       .Read(read => read.Action("AuthorisationsPartial", "UserFilesDashboard")))%> 

wie kann ich das obige Verhalten erreichen? Vielleicht könnte jQuery nützlich sein (aber ich habe nur sehr wenige Kenntnisse von jQuery). Jede Hilfe wird geschätzt. Vielen Dank im Voraus.

Antwort

4

der Tat können Sie das dataBound Ereignis des Grid und jQuery verwenden, um die k-State-ausgewählte Klasse zum ersten tr Element im tbody des Grid hinzuzufügen.

hier ein Beispiel:

$('#GridName').data().kendoGrid.bind('dataBound',function(e){ 
    this.element.find('tbody tr:first').addClass('k-state-selected') 
}) 
+1

aber dies ist nicht wirklich die Auswahl – CMS

3

Es ist auch möglich 1 über

<div data-bind="source: mydataSource, events: { 
    dataBound: onDataBound 
}" > 

zum onDataBound Ereignis

Bind das Gitter dies eine andere Art und Weise

Methode zu tun für MVVM oder über die

("#gridName").data("kendoGrid").dataBound(..) (not exact) 

Methode 2

Innerhalb des

databound: function() { 
    var uid = data[0].uid; 
    var row = roomGrid.table.find('tr[data-uid="' + uid + '"]'); 
    roomGrid.select(row); 
} 

Dies funktioniert in meinem Fall. Ich hoffe es hilft.

0
$('#gridName').data().kendoGrid.bind('dataBound', function (e) { 
      this.select("tr:eq(1)"); 
      //this.element.find('tbody tr:first').addClass('k-state-selected'); 
     }) 

für weitere Einzelheiten siehe unten Link http://docs.kendoui.com/api/web/grid#methods-select

+0

Können Sie erklären, wie dieser Code funktioniert? Code-only-Antworten (obwohl sie manchmal akzeptiert werden) könnten verbessert werden, indem etwas hinzugefügt wird, um zu erklären, was es tut oder wie es funktioniert. Vielen Dank! –

0

Nachdem Sie den Code aus der Aktualisierung:

$('#GridName').data().kendoGrid.bind('dataBound',function(e){... 

zu:

$('#GridName').data("kendoGrid").bind('dataBound', function (e) {... 

Jetzt ist es fix und der endgültige Code unten funktioniert:

$(function() { 
    $('#GridMaster').data("kendoGrid").bind('dataBound', function (e) { 
     this.element.find('tbody tr:first').addClass('k-state-selected') 
    }); 
}); 


Hinweis: Wenn es ein Problem für die Aufzeichnungen auf dem Gitter zu erhalten, verwenden Sie dieses Skript nach der Grid-Definition statt, bevor die Grid-Definition.

Verwandte Themen