Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Guilherme Luiz

Selecionar checkbox com onchange de select

Recommended Posts

Olá pessoal,

Atualmente estou utilizando o seguinte código para selecionar um determinado checkbox quando um select tem seu valor alterado:

FUNÇÃO JAVASCRIPT

function verifica_alteracao(){
var grupo_box = document.getElementById('contato_select');
grupo_box.checked='true';
}

Html do Select

<select name="grupo_id" id="grupo_id" onChange="verifica_alteracao()">
<option>Bla bla bla bla</option>
</select>

Html do Checkbox

<input name="contato_id[]" id="contato_select" type="checkbox" value=".$result['id']." />

O código funcionaria perfeitamente se eu tivesse apenas um SELECT e apenas um Checkbox, mas não é o caso.

Tanto o select quanto o checkbox, são repetidos num while da minha pesquisa MySQL e por isso, numa única página posso ter dezenas de selects e checks com o mesmo nome/id, e o código citado acima, seleciona apenas o checkbox da primeira linha.

O que estou querendo fazer e até agora não consegui, é fazer com que a alteração do SELECT de uma determinada linha, selecione apenas o Checkbox dessa mesma linha.

Alguma luz? Ajuda?

Compartilhar este post


Link para o post
Compartilhar em outros sites

use Jquery para isso

$("#idCheckBox").attr("checked", "checked");

Mas como faço isso num loop?

Na mesma <tr> eu tenho o checkbox e o select e quando houver mudança no select eu quero selecionar o check.

Se for 1 por 1 ok mas terei diversas linhas, ou seja, diversos <tr>... como faço para que o select mudado, mexa apenas no checkbox da mesma <tr>?

Compartilhar este post


Link para o post
Compartilhar em outros sites

function mudar_cor(linha){


var box = linha.getElementsByTagName("input");
var grupo = linha.getElementsByTagName('select');


if(grupo[0].onchange){


box[0].checked=false;
linha.style.backgroundColor = "";


}else{


linha.style.backgroundColor = "#C0C0C0";
box[0].checked=true;

   }  
}

Esse é o Javascript atual que utilizo.

Na minha <tr> utilizo onclick=mudar_cor(this)

Dessa forma acontece o seguinte:

- Ao clicar em qualquer parte da minha TR a função é chamada

- Ao clicar no selecct a função é chamada

- A cor de toda a linha é alterada e o checkbox é selecionado

Até ai o funcionamento está "meia-boca" porque:

- O checkbox após selecionado, fica "travado" e não é possivel tirar a seleção dele

Também tenho o seguinte código:

function mudar_cor(linha){
var box = linha.getElementsByTagName("input");;

if(box[0].checked){

linha.style.backgroundColor = "#C0C0C0";

}else{

linha.style.backgroundColor = "";

   }  
}

Neste código ao selecionar o checkbox a cor da linha é alterada e ao tirar o selecionado do checkbox a linha volta pro style original.

O que quero além disso é que ao clicar no select que tenho na linha, essa alteração de cor e o checkbox seja selecionado e que ao desmarcar o checkbox a cor volte ao original.

Compartilhar este post


Link para o post
Compartilhar em outros sites

No html é apenas uma tabela como disse acima onde em cada linha tenho o Checkbox e o select.
Essa linha é repetida diversas vezes porque é resultado de consulta a BD.

Mas é

<tr>
<th scope="row"> <input id="checkall" type="checkbox" name="chkAll_contato" onclick="checkAll_contato(this)"></th>
<td> dado 1 </td>
<td> dado 1 </td>
<td> Coluna do select </td>
</tr>

<tr onclick="mudar_cor(this)">
<th scope="row"> <input name="contato_id[]" id="contato_select" type="checkbox"> </th>
<td> dado 1 </td>
<td> dado 1 </td>
<td> <select name="grupo_id[]" id="grupo_id"> <option> Nome do grupo </option> </select> </td>
</tr>

O primeiro TR é apresentado apenas uma unica fez porque é o cabeçalho da tabela.
O segundo TR repete diversas vezes de acordo com a quantidade de registros no meu BD.

O que estou tentando é que ao clicar no SELECT, além da mudança da cor da linha, quero que o Checkbox da linha seja selecionada.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tenta assim

fuction check(checkbox){

var $input = $(checkbox);$input .prop( "checked" );

}

ele vai alterar a propriedade para checked

aqui a documentação: http://api.jquery.com/prop/

só alterar para a sua realidade

OBS: n sei se a fuction vai funcionar pq fiz de cabeça.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.