JQuery表格分拣机问题

我了解到，通过尝试使用jquery中的tablesorter插件，表需要使用< thead和
< tbody>标签。我使用的是一个html表格，我使用runat =“server”属性，因为我需要将数据绑定到服务器端的表上。但通过使用RUNAT =服务器属性的代码在不同的way..instead看起来像这样的观点来源是什么在我的标记视图中呈现：JQuery表格分拣机问题

<table id="Table"> 
    <thead> 
     <tr> <th>1st</th> <th>2nd</th> <th>3rd</th> </tr> 
    </thead> 
    <tbody> 
     <tr><td>1st value</td><td>2nd value</td><td>3rd value</td></tr> 
     <tr><td>1st value</td><td>2nd value</td><td>3rd value< /td></tr> 
     <tr><td>1st value</td><td>2nd value</td><td>3rd value</td></tr> 
     <tr><td>1st value</td><td>2nd value</td><td>3rd value</td></tr> 
    </tbody> 
</table>

它看起来像，但没有< thead>和< tbody>标签..这将使桌面分拣机不工作？有人可以帮我解决这个问题吗？ “.NET 3.5 SP1是我使用的版本”

来源

2008-12-15 TStamper

你应该在这里一看 - 从本质上讲，你需要使用的GridView的UseAccessibleHeader property使得THEAD标记在HTML输出输出Code Project Sortable Gridview using JQuery Tablesorter

。

protected void Page_Load(object sender, EventArgs e) 
{ 
if (this.gridView.Rows.Count > 0) 
{ 
gridView.UseAccessibleHeader = true; 
gridView.HeaderRow.TableSection = TableRowSection.TableHeader; 
gridView.FooterRow.TableSection = TableRowSection.TableFooter; 
} 
}

如果使用HTML表格带有runat =“server”属性，而不是asp.net服务器控件，它看起来好像没有一个简单的方法来防止THEAD标记从HTML渲染不输出。你可以使用一些JQuery的插入THEAD标记插入文档中的DOM现成

//in script tags after JQuery and JQuery tablesorter src declarations 
    $(function() 
    { 
     $('#test').prepend(
     $('<thead></thead>').append($('#test tr:first').remove()) 
     ); 

     $("#test").tablesorter(); 
      //your table options 
    }); 


//your html and asp markup 
<table id="test" runat="server"> 
<thead><tr><th>1</th><th>2</th><th>3</th></tr></thead> 
<tbody> 
<tr><td>my data 1.1</td><td>this data 1.2</td><td>that data 1.3</td></tr> 
<tr><td>this data 2.1</td><td>that data 2.2</td><td>my data 2.3</td></tr> 
<tr><td>that data 3.1</td><td>my data 3.2</td><td>this data 3.3</td></tr> 
</tbody> 
</table>

输出这一点，这与tablesorter-

<table id="test"> 
<thead> 
<tr> 
<th class="header">1</th> 
<th class="header">2</th> 
<th class="header headerSortDown">3</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>this data 1.1</td> 
<td>that data 1.2</td> 
<td>my data 1.3</td> 
</tr> 
<tr> 
<td>my data 2.1</td> 
<td>this data 2.2</td> 
<td>that data 2.3</td> 
</tr> 
<tr> 
<td>that data 3.1</td> 
<td>my data 3.2</td> 
<td>this data 3.3</td> 
</tr> 
</tbody> 
</table>

来源

2008-12-15 21:49:18

is t这里仍然使用html表来做到这一点。我已经使用html表格做了很多事情。我不想重新开始。 – TStamper 2008-12-15 21:57:23

更新我的答案，包括解决方案的HTML表格与runat =“服务器”属性 – 2008-12-16 12:26:16

开始与这个正确的工作...

print("<table class='turnMeIntoTableSort'><tr><td>heading1</td><td>heading2</td></tr><tr><td>content1</td><td>content2</td></tr><tr><td>content3</td><td>content4</td></tr></table>");

然后执行此操作：

print("$(document).ready(){ 
     $('table.turnMeIntoTableSort > tr:first').wrap('<thead></thead>'); 
     $('table.turnMeIntoTableSort > tr:gt(1)').wrapAll('<tbody></tbody>'); 

     //now draw the tablesorter 
     $('table.turnMeIntoTableSort').tablesorter(); 
     }");

来源

2008-12-16 00:11:41

JQuery表格分拣机问题

回答

相关问题