disable buttons by name

Question

disable buttons by name

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I'm trying to give disabled on all buttons with the same name, however it does not work, what am I doing wrong?

//HTML BOTÃO QUE EU QUERO DESATIVAR
<button class="teclado" id="Q" name="nameTeclado" onClick="forca(this.id);">Q</button>
//HTML BOTÃO QUE ESTOU USANDO PARA DESATIVAR
<button onClick="teste();">teste</button>
//JS
function teste() {
document.getElementsByName("nameTeclado").disabled = "true";
}

There are many buttons that I need to disable at once, so I can not do with get.elementById (which in case works)

javascript

asked by anonymous 15.06.2018 / 04:13

2 answers

Display flex does not work with CSS property Find the index in a vector of dictionaries based on the value

score 0 · Answer 1

The problem occurs because when you search for elements by name podem existir vários elementos com o mesmo name (o que é o seu caso), então o getElementsByName irá retornar vários elementos. Para setar o disabled de todos os elementos, você precisará percorrer esse array setando o atributo disabled pra true 'like this:

//aqui você pega todos os elementos do mesmo nome e salva numa variável
var botoes = document.getElementsByName("nameTeclado");

//como o getElementsByName retorna uma NodeList e não ArrayList, precisa transformar em Array pra conseguir usar o forEach 
var botoesList = Array.prototype.slice.call(botoes);

//aqui você percorre o array botoes e seta o disabled para true
botoesList.forEach(function(element) {
    element.disabled = true;
});

Sources:

HTML DOM Documentation getElementsByName ()

Array.prototype.forEach () documentation

score 0 · Answer 2

All buttons with the same name

function teste() {
   //quantidade de elementos com name = nameTeclado
   var x = document.getElementsByName("nameTeclado").length;
   for(i=0;i<x;i++){
     document.getElementsByName("nameTeclado")[i].disabled = "true";
   }
}

<button class="teclado" id="Q1" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q2" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q3" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q4" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q5" name="nameTeclado" onClick="forca(this.id);">Q</button>
<button class="teclado" id="Q6" name="nameTeclado" onClick="forca(this.id);">Q</button>


<button onClick="teste();">teste</button>

I put different IDs because IDs are unique and in addition will have to pass different id in onClick="forca(this.id)