2

このページのtablesorterプラグインを使用しようとしています。これは、クライアント側で並べ替えを行う非常に単純なプラグインです。

これが私のリピーターです：

<asp:Repeater ID="RepeaterChangeLog" runat="server" >
        <HeaderTemplate>
            <table id="ChangeLogTable" class="table tablesorter table-bordered"> 
            <thead>
                <tr>
                <th>Date de correction</th>
                <th>Correcteur</th>
                <th>BugID</th>
                <th>Catégorie</th>
                <th>Module</th>
                <th>Description de la correction</th>
                <th>Impact</th>
                <th>Rapporté par</th>
                <th>Demandé par</th>
                </tr>
            </thead>
        </HeaderTemplate>
        <ItemTemplate>
            <tbody>
                <tr>
                    <td width="125px"> <%# DataBinder.Eval(Container.DataItem, "ChangeLogDate")%></a></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "FixedBy")%> </td>
                    <td width="75px"> <%# DataBinder.Eval(Container.DataItem, "BugID")%> </td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "Category")%> </td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "Module")%> <%# DataBinder.Eval(Container.DataItem, "AdditionalModule")%></td>
                    <td width="300px"> <%# DataBinder.Eval(Container.DataItem, "Description")%> </td>
                    <td width="300px"> <%# DataBinder.Eval(Container.DataItem, "Impact")%> </td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "ReportedBy")%> </td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "AskedBy")%> </td>
                </tr>
            </tbody>
        </ItemTemplate>

        <FooterTemplate>
            </table>
        </FooterTemplate>
    </asp:Repeater>

これが私がテーブルソーターと呼ぶ方法です

$(document).ready(function () {
            $("#ChangeLogTable").tablesorter();
    });

結果は奇妙です。CSSが適用されているのがわかります。ヘッダーをクリックすると上下の矢印が変わりますが、並べ替え自体は機能しません。同じページにある非常に単純なテーブルを試しましたが、そのテーブルは完全に機能していました。2つの違いは、1つはリピーターで生成され、もう1つはプレーンHTMLのみであるということだけです。私の意見では、結果は同じhtmlであるため、違いはないはずですが、Microsoftがヘッダーに秘密の隠しコードを入れて、プラグインを失敗させる可能性があります。

誰かが私がこの問題を回避するのを手伝ってくれることを願っています！ありがとう！

4

2 に答える 2

1

私は問題を発見し、最初にそれを見なかったなんて信じられませんが、ええと... 金曜日でした!

プラグインは、私があまり慣れていない「新しい」thead と tbody で動作します。リピーターを作成したとき、ヘッダー テンプレートに thead を配置し、ItemTemplate に tbody を配置しました。しかし、忘れていたのは、ItemTemplate が各行で繰り返されるため、テーブルには複数の tbody が含まれていたことです。これは問題であり、プラグインはこれでは動作しません。つまり、ひどい HTML でした。

したがって、tbody が適切な場所に配置された優れたリピーターは次のとおりです。

<asp:Repeater ID="RepeaterChangeLog" runat="server" >
        <HeaderTemplate>
            <table id="ChangeLogTable" class="table tablesorter table-bordered"> 
            <thead>
                <tr>
                <th>Date de correction</th>
                <th>Correcteur</th>
                <th>BugID</th>
                <th>Catégorie</th>
                <th>Module</th>
                <th>Description de la correction</th>
                <th>Impact</th>
                <th>Rapporté par</th>
                <th>Demandé par</th>
                </tr>
            </thead>
            <tbody>
        </HeaderTemplate>
        <ItemTemplate>
                <tr>
                    <td width="125px"> <%# DataBinder.Eval(Container.DataItem, "ChangeLogDate")%></a></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "FixedBy")%></td>
                    <td width="75px"><a href="http://adobs.aquadata.com/edit_bug.aspx?id=<%# DataBinder.Eval(Container.DataItem, "BugID")%>"><%# DataBinder.Eval(Container.DataItem, "BugID")%></a></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "Category")%></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "Module")%> <%# DataBinder.Eval(Container.DataItem, "AdditionalModule")%></td>
                    <td width="300px"> <%# DataBinder.Eval(Container.DataItem, "Description")%></td>
                    <td width="300px"> <%# DataBinder.Eval(Container.DataItem, "Impact")%></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "ReportedBy")%></td>
                    <td width="100px"> <%# DataBinder.Eval(Container.DataItem, "AskedBy")%></td>
                </tr>                
        </ItemTemplate>
        <FooterTemplate>
            </tbody>
            </table>
        </FooterTemplate>
    </asp:Repeater>
于 2012-10-15T12:11:06.477 に答える