2012-06-29 29 views
3

我使用jQuery tablesorter插件排序在asp.net應用程序一個gridview點擊。我可以捕獲列索引,但似乎無法弄清楚如何獲取列名。我怎麼能得到的列名使用jQuery的tablesorter

這是我在做什麼,任何人都可以請幫助?

var currentSort; 

     $('#gvTickets').tablesorter({ 
      // sort on the last column, order asc 
      sortList: [[9, 0]] 
     }).bind("sortEnd", function(sorter) { 
      currentSort = sorter.target.config.sortList; 

     }); 

預先感謝您!

下面是HTML:

<div> 
<table class="stretchalltable" cellspacing="0" rules="all" border="1" id="gvTickets" style="border-collapse:collapse;"> 
    <thead> 
     <tr> 
      <th scope="col" class="header" style="cursor: pointer; ">Requester</th><th scope="col" class="header" style="cursor: pointer; ">Subject</th><th scope="col" class="header" style="cursor: pointer; ">Type</th><th scope="col" class="header" style="cursor: pointer; ">Category</th><th scope="col" class="header" style="cursor: pointer; ">Priority</th><th scope="col" class="header" style="cursor: pointer; ">Status</th><th scope="col" class="header" style="cursor: pointer; ">Due</th><th scope="col" class="header" style="cursor: pointer; ">Assigned To</th><th scope="col" class="header" style="cursor: pointer; ">Created</th><th scope="col" class="header headerSortUp" style="cursor: pointer; ">Days</th> 
     </tr> 
    </thead><tbody> 

    <tr> 
      <td>JMAULDIN</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=7827">Van Order Entry Customer Contract Lookup Display</a></td><td>Project</td><td>Portal </td><td>Normal</td><td>On Hold</td><td>&nbsp;</td><td>Nathan Baker - Doozer</td><td>27-DEC-2011</td><td>133</td> 
     </tr><tr style="background-color:#E6E6E6;"> 
      <td>RCRITTENDEN</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=8190">Cap changes</a></td><td>Project</td><td>Portal </td><td>Normal</td><td>On Hold</td><td>&nbsp;</td><td>Nathan Baker - Doozer</td><td>02-FEB-2012</td><td>106</td> 
     </tr><tr style="background-color:#E6E6E6;"> 
      <td>JMAULDIN</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=8796">Online SRN -- Add email SRN like print SRN</a></td><td>Project</td><td>Portal </td><td>Normal</td><td>New</td><td>&nbsp;</td><td>Nathan Baker - Doozer</td><td>15-MAR-2012</td><td>76</td> 
     </tr><tr> 
      <td>JMAULDIN</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=9058">SES AST field not saving correctly.</a></td><td>Project</td><td>Portal </td><td>Normal</td><td>On Hold</td><td>&nbsp;</td><td>Nathan Baker - Doozer</td><td>20-MAR-2012</td><td>73</td> 
     </tr><tr> 
      <td>RAVRIETT</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=9470">Copy Project Plan (ignore deleted items)</a></td><td>Support Task</td><td>Loaned Item </td><td>Normal</td><td>New</td><td>&nbsp;</td><td>Nathan Baker - Doozer</td><td>24-APR-2012</td><td>48</td> 
     </tr><tr> 
      <td>TCACCAM</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=9670">WEB: Contracts Administration</a></td><td>Support Task</td><td>Portal </td><td>High</td><td>New</td><td>14-MAY-2012</td><td>Nathan Baker - Doozer</td><td>14-MAY-2012</td><td>34</td> 
     </tr><tr style="background-color:#E6E6E6;"> 
      <td>DOOZER1</td><td><a href="ticket2.aspx?action=edit&amp;ticket_id=10041">nb test</a></td><td>Project</td><td>Portal </td><td>Normal</td><td>New</td><td>13-JUN-2012</td><td>Nathan Baker - Doozer</td><td>13-JUN-2012</td><td>12</td> 
     </tr></tbody> 
</table> 

謝謝fudgey的答覆。無論我嘗試什麼,我似乎無法得到這個工作。基本上我需要做的是在jquery tablesorter中,我需要將sortList的值作爲變量。它需要像這樣:

var currentSort; 

    $('#gvTickets').tablesorter({ 
     // sort on the last column, order asc 
     sortList: currentSort 
    }).bind("sortEnd", function(sorter) { 
     currentSort = sorter.target.config.sortList; 

    }); 

我需要的currentSort存儲在會話和通過Ajax調用檢索排序,然後以同樣的方式這是最後一次查看的網格。如果用戶點擊該頁面,對網格進行排序,離開頁面,然後返回,我需要按照與頁面上一次相同的方式對頁面進行排序,只要它在會話狀態的範圍內即可。

有誰知道的方式來處理呢?

謝謝

+0

我們可以看到HTML? – jeschafe

+0

嗨jeschafe,是的請參閱上面的html。謝謝 – Nathan

回答

2

使用索引來查找從標題的文本 - 它甚至可能會更容易使用保存headerList像這樣(​​):

$('#gvTickets') 
    .tablesorter({ 
     // sort on the last column, order asc 
     sortList: [[9, 0]] 
    }) 
    .bind("sortEnd", function(event) { 
     var table = event.target, 
      currentSort = table.config.sortList, 
      // target the first sorted column 
      columnNum = currentSort[0][0], 
      columnName = $(table.config.headerList[columnNum]).text(); 

     console.log(columnName); 

    });​ 
+0

嗨,非常感謝你的回答。對於您或其他任何可能知道的人,我還有一個問題。是否有可能將sortList設置爲像這樣的變量sortList:currentSort?它似乎沒有工作。 – Nathan

+1

不幸的是,原始版本的tablesorter(2.0.5)不保存當前的sortList。但是我在github上有一個[tablesorter]的分支(https://github.com/Mottie/tablesorter),如果你有興趣的話,它會用當前的排序更新'table.config.sortList'。 – Mottie

+0

嗨fudgey,我所要做的是保存排序順序會話,所以如果用戶離開頁面,並返回電網排序他們的方式。你的版本會爲此工作嗎?我可以成功地保存並從會話中檢索排序順序,但是當我嘗試設置sortList:[[currentSort]]時它不起作用。 – Nathan

1

您也可以捕捉到它的外部,其他地方(例如,在你的函數,阿賈克斯開始,..),只有在需要的時候,而不是在每一次點擊,用少一點的開銷是這樣的:

lastSortList=$("#mytable")[0].config.sortList; 

和實例AJAX更新後排序回:

$("#mytable").trigger("sorton", [lastSortList]); 

記住,雖然申報的權利範圍的第一行。