如何将（不完整的）选择列表的顺序恢复为原始顺序？ [英] How can I restore the order of an (incomplete) select list to its original order?

问题描述

我有两个选择列表，您可以在这两个列表之间移动所选选项。您还可以在右侧列表中上下移动选项。

I have two Select lists, between which you can move selected options. You can also move options up and down in the right list.

当我将选项移回左侧列表时，我希望它们保留原来的位置。列表顺序，即使列表缺少一些原始选项。这仅仅是为了使列表更方便用户。

When I move options back over to the left list, I would like them to retain their original position in the list order, even if the list is missing some original options. This is solely for the purpose of making the list more convenient for the user.

我目前正在定义一个包含原始选择列表onload的数组。

I am currently defining an array with the original Select list onload.

实现这个的最佳方法是什么？

What would be the best way to implement this?

推荐答案

您可以存储原始订单在一个数组中，当插回时，确定数组中最先插入的元素是什么，并且与选择列表中当前的元素相匹配。然后在那之后插入。

You can store the original order in an array, and when inserting back, determine what's the latest element in the array that precedes the one to be inserted AND matches what's currently in the select list. Then insert after that.

更好的解决方案是只存储旧的数组并使用所需元素重新填充每个插入，如下所示（警告：代码未测试）

A better solution is to just store the old array whole and re-populate on every insertion with desired elements as follows (warning: code not tested)

function init(selectId) {
    var s = document.getElementById(selectId);
    select_defaults[selectId] = [];
    select_on[selectId] = [];
    for (var i = 0; i < s.options.length; i++) {
        select_defaults[selectId][i] = s.options[i];
        select_on[selectId][i] = 1;
        var value = list.options[i].value;
        select_map_values[selectId][value] = i if you wish to add/remove by value.
        var id = list.options[i].id; // if ID is defined for all options
        select_map_ids[selectId][id] = i if you wish to add/remove by id.
    }
}

function switch(selectId, num, id, value, to_add) { // You can pass number, value or id
    if (num == null) {
        if (id != null) {
            num = select_map_ids[selectId][id]; // check if empty?
        } else {
            num = select_map_values[selectId][value]; // check if empty?
        }
    }
    var old = select_on[selectId][num];
    var newOption = (to_add) : 1 : 0;
    if (old != newOption) {
        select_on[selectId][num] = newOption;
        redraw(selectId);
    }
}

function add(selectId, num, id, value) {
    switch(selectId, num, id, value, 1);
}

function remove(selectId, num, id, value) {
    switch(selectId, num, id, value, 0);
}

function redraw(selectId) {
    var s = document.getElementById(selectId);
    s.options.length = 0; // empty out
    for (var i = 0; i < select_on[selectId].length; i++) { 
        // can use global "initial_length" stored in init() instead of select_on[selectId].length
        if (select_on[selectId][i] == 1) {
            s.options.push(select_defaults[selectId][i]);
        }
    }
}

这篇关于如何将（不完整的）选择列表的顺序恢复为原始顺序？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！