在Telerik MVC Grid上的選定的行

Question

我有一個Telerik MVC Grid，我希望選擇被強制在列表之上。我正在爲網格使用DetailedView，因此它是摺疊和可展開的。我將如何強制選定的行到列表的頂部？

我的Jquery：

function unit_onDetailViewExpand(e) { 
    // Select the Grid 
    var grid = $(this).data('tGrid'); 
    //Close all other rows 
    grid.$rows().not(e.masterRow).each(function (index, row) { 
     grid.collapseRow(row); 
    }); 

    /* TODO: move row to the top, this hasn´t worked for me so far 
    grid.reorderColumn(0, grid.columnFromTitle("Name")); 
    $.telerik.trigger(grid.element, 'repaint'); 
    */ 
} 

感謝名單傢伙:)

#### EDITED ####

這就是我現在做的選擇行時：

function onRowSelect(e) { 
    $(e.row).prependTo($(e.row).parent()); 
    var grid = $('#RentableUnits').data("tGrid"); 
    // get the first master table row 
    var tr = $("#RentableUnits tbody > .t-master-row:eq(0)"); // use .t-master-row to select only the master rows 

    // expand the row 
    grid.expandRow(tr); 
} 

現在我面臨的問題是DetailedView的內容沒有移動。比方說，我選擇一行，行移動到頂部，展開行，但前一行的內容仍在擴展。

我一直在尋找documentation，發現這與detailRow有關，但我無法弄清楚如何將它與我的masterRow一起移動。

有沒有人有任何想法如何隨着行移動detailview的內容？

####編輯（再次）####

從來就變得至今，錶行被移動到每次列表的頂部，但該特定行擴大我一直獲取原始頂行的內容（來自第二位的內容）。從我在Firebug中看到的情況是，表中沒有.t-detail-row，直到.t-master-row之一被擴展。我是否應該隨選定的行移動其他內容，其他的是指masterRow，有時是detailRow？

（從來就還上載與顯示來自螢火蟲HTML問題沿着圖像）

function onRowSelect(e) { 
    var grid = $('#RentableUnits').data("tGrid"); 

    var selectedRow = $('#RentableUnits tbody>.t-state-selected'); 
    selectedRow.prependTo(selectedRow.parent()); 
    if (selectedRow.next().is('.t-detail-row')) { 
     selectedRow.next().prependTo(selectedRow.parent()); 
    } 
    selectedRow.prependTo(selectedRow.parent()); 

    // get the first master table row 
    var tr = $("#RentableUnits tbody > .t-master-row:eq(0)"); // use .t-master-row to select only the master rows 
    // expand the row 
    grid.expandRow(tr); 
} 

......你一直對我有很大的幫助，也許我可以竊聽一次嗎？ :)

＃

＃

＃

Answer 1

一個網格組件已基本數據。 您需要定位由選定行代表的數據項目。

function on_RowSelect(e){ 

    var grid = $(e.target).data('tGrid'); 
    var $rows = grid.$rows(); 

    // move underlying data 
    var rowIndex = $rows.index(e.row); 
    grid.data.unshift(grid.data.splice(rowIndex,1)[0]) 

    // move rows 
    var $selectedRows = $(e.row).add($(e.row).next('.t-detail-row')); 
    $rows.parent().prepend($selectedRows); 
} 

問候

Answer 2

您可以輕鬆地選擇所需的行時下面的腳本移動到頂端：

var selectedRow= $('#GridName tbody>.t-state-selected'); 
selectedRow.prependTo(selectedRow.parent()) 

請請注意，如果需要，您可以將選擇器更改爲更通用 - 使用cl屁股名稱或使用搜索上下文來查找選定的行。

或者你也甚至可以使用onRowSelect事件來執行這樣你的邏輯：

function onRowSelect(e){ 
    $(e.row).prependTo($(e.row).parent()); 
}