Deselect items when moving between listboxes

Question

Deselect items when moving between listboxes

Navigation

#1 by (1 votes)

2

In my application I have two listboxes, one with "available players" and one with "scaled players", as well as two buttons to move the items between them, > and > .

My problem is this. As soon as I select an item in one of the listbox, and in the click sequence on some item in the OTHER listbox, the item that was first clicked is still selected.

I need a way to do the following. Example: I first click on a name in the left listbox and the > > button to move the item to the right listbox is enabled. But then I realize that this is not what I wanted and I click on a name from the RIGHT listbox this time. Since there is now one selected in it, the button is enabled. However, the first option clicked in the other listbox is still selected, and the > > button is still enabled. I need that when clicking on another listbox, all the items that by chance have been selected in the previous listbox, are deselected.

Below is an image of the problem, with the two move buttons enabled at the same time, due to the problem I described above.

And below is the code that enables and disables the buttons:

function habilitarBotoes(){
    var disponiveis = document.getElementById("jogadores_disponiveis");
    var escalados = document.getElementById("jogadores_escalados");
    var toRight = document.getElementById("toRight");
    var toLeft = document.getElementById("toLeft");
    var salvar = document.getElementById("salvar");
    var data = document.getElementById("data");
    if((getOpts(disponiveis).length > 0) && (getOpts(disponiveis).length + escalados.length <= 5)){
        toRight.disabled = "";
    } else { 
        toRight.disabled = "disabled"; 
    }

    if(getOpts(escalados).length > 0){
        toLeft.disabled = "";
    } else {
        toLeft.disabled = "disabled";
        }

    if((escalados.options.length == 5) && (CheckDate(data) == true) ){
        salvar.disabled = "";
    } else {
        salvar.disabled = "disabled";
    }
}

javascript select

asked by anonymous 21.10.2014 / 15:14

1 answer

Get network path Problem with grunt-uncss

score 1 · Answer 1

Clear the select of a select when the onChange event of the other is triggered (demo at: link ):

escalados.onchange = function () {
    limpaSelecionados(disponiveis); 
};

disponiveis.onchange = function () {
    limpaSelecionados(escalados);
};

function limpaSelecionados(lista) {
    //define a opçao selecionada como -1. como o indice das opçoes do select começa em 0, nao seleciona nenhuma opçao
    lista.options.selectedIndex = -1;

    //CASO A ACIMA NAO FUNCIONE EM ALGUM BROWSER, TENTE A OPÇAO ABAIXO
    //for (var i = 0; i < lista.options.length; i++) {
      //  lista.options[i].selected = false;
    //}
}