php - 使用 PHP 和 Ajax 对同一页面上的多个结果进行排序

Question

我的页面有两列。 Column1 用于 player1，column2 用于 player2。对于每一列，我都有一个下拉列表来选择一名球员。

使用一些 ajax en php 代码，我返回每个玩家的以下信息。例如:

Col1:汤姆，足球:8分 篮球:5分

Col2:乔纳森，足球:4分 篮球:9分

现在我想让用户对结果进行排序:所以我在每一列中添加了另一个下拉列表:

PHP

echo "<select id='filter_class' name=\"filter\"
data-userid=\"".$user_id."\" onchange=\"getFilter(this.value)\">
<option value=\"all\">All</option>
<option value=\"asc\">Asc</option>
<option value=\"desc\">Desc</option> 
</select>";

AJAX

 function getFilter(filter)
{
    var user_id = document.getElementById('filter_class').getAttribute('data-userid');
    console.log(user_id);
    $.ajax({
        type: "GET",
        url: 'http://website.com',
        data: {action: filter, user_id: user_id},
        success: function (result) {
            $("#Target").html(result);
        }
    });
}

如您所见，下拉列表使用user_id 和option value 对结果进行排序。

此代码仅适用于 1 列，因为他一直(当然)使用第一个 user_id。例如，当我尝试对第二个结果进行排序时，他对第一个 user_id (Normal) 的结果进行排序。

我希望 SORT DROPDOWN 使用玩家的 user_id 在同一列中选择。

重要

我想在页面上显示两个结果后使用排序选项。

Answer 1

您需要使用不同的 ID 创建您的 SORT 下拉列表。假设您有 id 的 id='filter_class1' 和 id='filter_class2'。

现在您需要像这样将调用下拉列表的 ID 传递给 getFilter() 函数。

onchange=\"getFilter(this.value, this.id)\"

getFilter() 函数的前几行应如下所示:

function getFilter(filter, eleId)
{
    var user_id = document.getElementById(eleId).getAttribute('data-userid');
    console.log(user_id);

...