Javascript中的排序选择选项-基于同一行中的多个值

Sorting Select Option in Javascript - Based on multiple values in same row

本文关键字:于同一 排序 选择 选项 Javascript      更新时间:2023-09-26

我创建了一个这样的列表框,并创建了一个标题栏来帮助排序数据:

ID                 Name
------------------------------------------------------------
ID1                Identity One
ID2                Identity Two
ID3                Identity Three
ID4                Identity Four
-------------------------------------------------------------

我有一个要求排序上面的列表基于ID,也对名称,意味着当用户单击ID,它应该排序基于ID的列表,反之亦然。但问题是,从数据层我们得到这样一行:

ID1   &nbsp:Idenitity One

所以我们在options标签中打印相同的内容,并得到如上的输出。生成上述输出的代码是:

 <select id="selSort" size="10" style="width:350px" id="rpt">
<option value = "ID1">
        ID1 &nbsp; &nbsp; Identity One
</option>
<option value = "ID2">
        ID2 &nbsp; &nbsp; Identity Two
</option>
<option value = "ID4">
        ID4 &nbsp; &nbsp; Identity Four
</option>
<option value = "ID3">
        ID3 &nbsp; &nbsp; Identity Three
</option>

我的问题是我如何实现上述场景的排序工具?是的,我试图排序,但它排序整个列表框,而不是基于单一值。至少现在我能做的是格式化传入的数据,将所有id放在一个数组中,将名称放在另一个数组中,因此对此有任何指导/指针表示赞赏。如果我没有解释清楚,请让我知道

编辑:

代码我试图排序一个列表框

function sortSelect(selElem) {
    var tmpAry = new Array();
    for (var i=0;i<selElem.options.length;i++) {
        tmpAry[i] = new Array();
        tmpAry[i][0] = selElem.options[i].text;
        tmpAry[i][1] = selElem.options[i].value;
    }
    tmpAry.sort();
    while (selElem.options.length > 0) {
        selElem.options[0] = null;
    }
    for (var i=0;i<tmpAry.length;i++) {
        var op = new Option(tmpAry[i][0], tmpAry[i][1]);
        selElem.options[i] = op;
    }
    return;
}

您可以使用自定义数组排序看看这个如何根据id对select进行排序?

这里的想法是创建一个数组,并根据其值进行排序,然后根据排序后的值动态创建选项。

自定义排序代码

source.sort(function (x, y) {
  if (isAsc) 
     return y.id - x.id;
  else 
    return x.id - y.id;
});