首页 > 解决方案 > Jquery Tablesorter 插件无法与 AjaxToolkit Accordion 一起正常运行

问题描述

我正在开发一个 ASP webform 项目,并且在使用 JQuery tablesorter 插件时遇到了一些困难。我将该插件应用于 Ajax Accordion 中的 ASP Gridview 控件。我不确定问题出在哪里,但表格在加载的第一页上没有完全显示。非常感谢您的帮助和反馈

请参阅第一页上的图片加载: 表格无法完全加载

但是在每次回发之后或在我调整浏览器(最小化/最大化)之后,表格就会完全加载。

见图片: 全表

//tablesorter的js代码

function BindTablesorter() {
    
$('#gv_MoeglicheEmailverteiler').tablesorter({

        theme: 'jui',
        showProcessing: true,
        headerTemplate: '{content} {icon}',
        stickyHeaders: "tablesorter-stickyHeader",
        resizable: true,

        widgets: ['uitheme','zebra', 'filter', 'scroller'],

        widgetOptions: {
            scroller_upAfterSort: true,
            scroller_jumpToHeader: true,
            scroller_height: 450,
            scroller_fixedColumns: 2,
            scroller_addFixedOverlay: false,
            scroller_rowHighlight: 'hover',
            scroller_barWidth: null
          
        },

    });   

}

$(document).ready(function () {

   BindTablesorter(); 
});

// Gridview 的标记

<ajaxToolkit:AccordionPane ID="AccPEmailverteiler" runat="server">
  <Header><u>Emailverteiler</u></Header>
    <Content>
       <asp:UpdatePanel ID="up_EmailVerteilerOne" runat="server">
         <ContentTemplate>
           <script type="text/javascript">
           Sys.Application.add_load(BindTablesorter);
           </script>
           <asp:GridView ID="gv_MoeglicheEmailverteiler" runat="server" ClientIDMode="Static" 
           AutoGenerateColumns="false" BorderColor="#DEBA84" BackColor="Silver" HeaderStyle Height="40px" OnPreRender="gv_MoeglicheEmailverteiler_PreRender"             HorizontalAlign="Center" CellPadding="3" CssClass="tablesorter">
<Columns>                
  <asp:TemplateField HeaderText="Reihe" ItemStyle-Width="200px" ItemStyle-HorizontalAlign="Center">   
   <ItemTemplate>
    <%# Container.DataItemIndex + 1 %>   
   </ItemTemplate>
  </asp:TemplateField>
  <asp:BoundField DataField="gruppenname" HeaderText="Gruppenname" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px"/>                           
  <asp:BoundField DataField="standort" HeaderText="Standort" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px"/>
  <asp:BoundField DataField="beschreibung" HeaderText="Beschreibung" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px"/>             
  <asp:BoundField DataField="genehmigt" HeaderText="Genehmigt" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px"/>
  <asp:BoundField DataField="zielobjekt" HeaderText="ZielObjekt" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px"/>
  <asp:BoundField DataField="ACTION_CHECKED" HeaderText="Action_Checked" NullDisplayText="n/a" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" ItemStyle-Width="250px" />
  <asp:TemplateField ItemStyle-Width="300px"  HeaderText="Action" ItemStyle-HorizontalAlign="Center">
  <ItemTemplate>
   <asp:CheckBox ID="cb_CheckOneMoglicheverteilerRow" runat="server" ItemStyle-HorizontalAlign="Center" class="checkboxClass" AutoPostBack="true" onclick = "Check_Click(this);" OnCheckedChanged="CheckBox_CheckChanged"/>
  </ItemTemplate>        
  </asp:TemplateField>
</Columns>
<HeaderStyle ForeColor="Black" Font-Bold="True" BackColor="#CCCC00"></HeaderStyle>                       
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</Content>
</ajaxToolkit:AccordionPane>

标签: c#jqueryaccordiontablesorterscroller

解决方案


推荐阅读