Question

有点奇怪的问题，但我不确定如何解决它。

在下面的代码中，我正在尝试根据单击的行标题对表的所有元素进行排序。

起始HTML：

<table id="PracticeTable" class="col-md-10 col-md-offset-2">
<tr id="Column Names">
    <td class="ClientID col-xs-1">Client ID</td>
    <td class="ClientName col-xs-1">Client Name</td>
    <td class="PracticeID col-xs-1">Practice</td>
</tr>
@for (int i = 0; i < ViewBag.ClientDatabase.getDatabase().Count; i++)
{
    @:<tr class="DataRow">
        <td class="ClientID col-xs-1" data-name="@ViewBag.ClientDatabase.getByIndex(i).Id">@ViewBag.ClientDatabase.getByIndex(i).Id</td>
        <td class="ClientName col-md-2 col-xs-1" data-name="@ViewBag.ClientDatabase.getByIndex(i).getClientName">@ViewBag.ClientDatabase.getByIndex(i).getClientName</td>
        <td class="PracticeIDs col-xs-1" data-name="@ViewBag.ClientDatabase.getByIndex(i).getPracticeID">@ViewBag.ClientDatabase.getByIndex(i).getPracticeID</td>
        <td class="EditButtons col-xs-1" data-bind="visible: editVisible"><a href="~/Clients/Edit?clientId=@i">Edit</a></td>
    @:</tr> 
}

其中一个点击功能的示例：

jQuery(document).ready(function () {
    $(".ClientName").click(function () {
        alert("Name Clicked");
        var clients = $(".DataRow");
        var compareLine = $(clients).children(".ClientName");

        compareLine.sort(function (a, b) {
            var an = $(a).attr("data-name");
            var bn = $(b).attr("data-name");
            alert(an + " " + bn);

            if (an > bn) {
                return 1;
            }
            if (an < bn) {
                return -1;
            }
            return 0;
        });
        compareLine.detach().appendTo(clients);
    });
});

当我尝试如上所述追加行时，每个行中都会出现客户名称中的名称。有什么我想念的吗？我试图遍历compareLine中的数据以单独添加它们，但我无法弄明白。

编辑：从尚未完全删除的修复尝试中删除重复的代码。

Answer 1

如果你想对行进行排序，我认为你只需做一个小改动：

jQuery(document).ready(function () {
    $(".ClientName").click(function () {
        alert("Name Clicked");
        var clients = $(".DataRow");

        clients.sort(function(a, b) {
            var an = $(a).children(".ClientName").attr("data-name");
            var bn = $(b).children(".ClientName").attr("data-name");
            alert(an + " " + bn);

            if (an > bn) {
                return 1;
            }
            if (an < bn) {
                return -1;
            }
            return 0;
        });

        clients.detach().appendTo("#PracticeTable");
    });
});

好像你的sort函数被设计用于处理行，但是你正在对列的集合进行排序。

JQuery .appendTo（）多次添加行

1 个答案: