在过滤器后首先显示选定的类答案

【问题标题】：Show the selected-class in first after filter在过滤器后首先显示选定的类
【发布时间】：2017-06-18 02:46:53
【问题描述】：

我正在尝试过滤后对学生进行排序。过滤学生按钮类后，将更改文本，如下图所示。

我想要的是 select-student 的学生必须先进来，然后 reject-student 的学生！我该怎么做..？

PHP->HTML 返回如下：

<tbody>

<tr>
<td><span><img></span><p>Rasmus1 Lerdorf</p><p><b>Hallticket</b> : S28J1</p></td>
<td style="line-height:45px">4</td>
<td style="line-height:45px">9</td>
<td style="line-height:45px">8</td>
<td style="line-height:45px">4.5</td>
<td><span id="stu28" class="btn btn-danger reject-student selection-class">Not Selected</span></td>
<td style="line-height:45px"><input class="overrideStudent" type="text" name="picomment[28]"></td>
</tr>

<tr>
<td><span><img></span><p>Bill Gates</p><p><b>Hallticket</b> : S29J1</p></td>
<td style="line-height:45px">9</td>
<td style="line-height:45px">10</td>
<td style="line-height:45px">8</td>
<td style="line-height:45px">6.1</td>
<td><span id="stu28" class="btn  selection-class btn-success select-student">Selected</span></td>
<td style="line-height:45px"><input class="overrideStudent" type="text" name="picomment[29]"></td>
</tr>

</tbody>

这是选择学生的 Javascript 代码：

success: function (response) {
    $(".selection-class").addClass('btn-danger reject-student');
    $(".selection-class").removeClass('btn-success select-student');
    $(".selection-class").text('Not Selected');
    $.each(response['students'], function(k, student) {
        $("#stu"+student.student_id).removeClass('btn-danger reject-student');
        $("#stu"+student.student_id).addClass('btn-success select-student');
        $("#stu"+student.student_id).text('Student Selected');
    });
    $("#success_message").show();
    $("#success_message").html(response['message']);

【问题讨论】：

在服务器端这样做不是更好吗？
实际上从服务器端是不可能的，因为过滤器正在通过 Ajax 调用来处理响应数组，这将选择学生.. 使用该过滤器标准，@Armin
我想在向用户显示信息之前，您已经在服务器端拥有该信息。也许在您的数据库中（sql 查询中的“order by”），或者在您的响应数组（排序数组）中，或任何其他方式。可以在客户端执行此操作，但我认为如果您在服务器端有可重用列表会更好，而无需进行额外的客户端调整。但是，我可能错了……@Abid
“我怎么能这样做..？” – 你应该开始做一些适当的研究。 google.com/search?q=how+to+sort+elements+in+dom

标签： javascript php html sorting html-table

【解决方案1】：

您可以append() class "reject-student" 到其父选择器并获得所需的结果。

【讨论】：