0

私は持っていListViewます。その中で私は<table>アイテムテンプレートとして使用しています。<td>クラス名で並べ替えたい。

どうやってやるの?そして、これはボタンクリックで機能するはずです。

<asp:ListView ID="lstvRCGroupSource" runat="server" ViewStateMode="Disabled">
    <LayoutTemplate>
        <ul id="list3" class="conn" style="width: 90%; height: 171px;">
            <asp:PlaceHolder runat="server" ID="itemPlaceholder"></asp:PlaceHolder>
        </ul>
    </LayoutTemplate>
    <ItemTemplate>
        <li class="add" id="l3">
            <table id="tbl" style="width: 100%;">
                <tr class="mytr" style="width: 100%;">
                    <td class="border1" style="width: 50%;"><%# Eval("code") %></td>
                    <td class="border2" style="width: 50%;"><%# Eval("regon_name") %></td>
                </tr>
            </table>
        </li>
    </ItemTemplate>
</asp:ListView>

function sortUnorderedList(ul, sortDescending) {
    if (typeof ul == "string")
        ul = document.getElementById(ul);

    var lis = ul.getElementsByTagName("li");
    var vals = [];

    for (var i = 0, l = lis.length; i < l; i++)
        vals.push(lis[i].innerHTML);

    vals.sort();

    if (sortDescending)
        vals.reverse();

    for (var i = 0, l = lis.length; i < l; i++)
        lis[i].innerHTML = vals[i];
}

window.onload = function () {
    var desc = false;
    document.getElementById("stCodeDSC").onclick = function () {
        sortUnorderedList("list3", desc);
        desc = !desc;
        return false;
    }
}
4

3 に答える 3

1

DataGrid または DataGridView を使用します。並べ替えメカニズムが既に組み込まれています。

于 2012-04-09T13:27:36.077 に答える
0

OnItemCommand を使用しない理由:

LinkBut​​ton を ListView のテーブルに保持します。

<table id="tbl" style="width: 100%;">
            <tr class="mytr" style="width: 100%;">
                <td class="border1" style="width: 50%;">
                    <asp:LinkButton ID="LinkButton1" runat="server"><%# Eval("code") %></asp:LinkButton>
                    </td>
                <td class="border2" style="width: 50%;">
                <asp:LinkButton ID="LinkButton2" runat="server"><%# Eval("regon_name") %></asp:LinkButton>
                </td>
            </tr>
        </table>

OnItemCommand で LinkBut​​ton クリック イベントを検索します。

protected void ListView1_ItemCommand(object sender, ListViewCommandEventArgs e)
    {
        if (e.CommandName.Equals("Code"))
        {
            // sorting code
        }

        if (e.CommandName.Equals("RegionName"))
        {
            // sorting code
        }
    }
于 2012-04-09T13:28:24.127 に答える
0

このjQueryソート関数を見てください。コードで実装するのは非常に簡単です。

関数は次のとおりです。

jQuery.fn.sortElements = (function(){

    var sort = [].sort;

    return function(comparator, getSortable) {

        getSortable = getSortable || function(){return this;};

        var placements = this.map(function(){

            var sortElement = getSortable.call(this),
                parentNode = sortElement.parentNode,

                // Since the element itself will change position, we have
                // to have some way of storing its original position in
                // the DOM. The easiest way is to have a 'flag' node:
                nextSibling = parentNode.insertBefore(
                    document.createTextNode(''),
                    sortElement.nextSibling
                );

            return function() {

                if (parentNode === this) {
                    throw new Error(
                        "You can't sort elements if any one is a descendant of another."
                    );
                }

                // Insert before flag:
                parentNode.insertBefore(this, nextSibling);
                // Remove flag:
                parentNode.removeChild(nextSibling);

            };

        });

        return sort.call(this, comparator).each(function(i){
            placements[i].call(getSortable.call(this));
        });

    };

})();

実装は次のようになります。

$("#list3 li td").sortElements(function(a, b){
    return $(a).attr("class") > $(b).attr("class") ? 1 : -1;
});
于 2012-04-09T13:47:56.317 に答える