Pergunta

Eu quero fazer algo como abaixo a partir de uma caixa de seleção,

Há uma caixa de seleção em todas as linhas e eu gostaria de desativar todos os campos de entrada em uma linha com a classe. Room quando a caixa de seleção for clicada.

function toggleStatus(link) {
    $(link).closest(".room").children(':input').attr('disabled', true);
}

também tentou

function toggleStatus(link) {
    $(link).closest(".room").children('input[type=text]').attr('disabled', true);
}
Foi útil?

Solução

Sua pergunta tem algumas ambiguidades, então o seguinte pode não ser exatamente O que você está procurando.

Após o clique, você deve atravessar a linha de mesa mais próxima, encontrar todas as entradas com o nome da classe .room e defina seu atributo desativado de acordo com o status da própria caixa de seleção.

$(":checkbox").click(function(){
  $(this).closest("tr").find(":input.room")
    .attr("disabled", $(this).is(":checked"));
});

Isso pressupõe uma estrutura semelhante à que se segue:

<table>
  <tbody>
    <tr>
      <td><input type="checkbox" /></td>
      <td><input type="text" class="room" /></td>
      <td><input type="text" class="room" /></td>
      <td><input type="text" class="room" /></td>
    </tr>
    <tr>
      <td><input type="checkbox" /></td>
      <td><input type="text" class="room" /></td>
      <td><input type="text" class="room" /></td>
      <td><input type="text" class="room" /></td>
    </tr>
  </tbody>
</table>

Demoção online: http://jsbin.com/umimu/edit

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top