Skip to content

Instantly share code, notes, and snippets.

@igoralves1
Last active April 19, 2016 12:29
Show Gist options
  • Save igoralves1/91120405b9cf011713421456e81ec003 to your computer and use it in GitHub Desktop.
Save igoralves1/91120405b9cf011713421456e81ec003 to your computer and use it in GitHub Desktop.
JS - Select <tr> - Traversing DOM
Selecionando elemento de uma linha na tabela A, muda o comprtamento de linhas selecionadas em outras tabelas, inclusive a A.
https://jsfiddle.net/aj1p62bz/
//Html
<table style='width:50% ;height:50%;border: 3px solid #00BABF;border-collapse: collapse;' align='center'>
<tr class="rowProducts" id="rowPrd">
<td>
<table >
<tr>
<td>Jill</td>
<td>Smith</td>
<td>
<input class='infoCheck' type="checkbox" value="0">
</td>
</tr>
<tr hidden class="tr_prodInfo tr_hidden" id="trTest1">
<td >Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
</td>
<td>
<table >
<tr>
<td>Jill2</td>
<td>Smith2</td>
<td></td>
</tr>
<tr hidden class="tr_InvoiceInfo tr_hidden" id="trTest2">
<td>Eve2</td>
<td>Jackson2</td>
<td>942</td>
</tr>
</table>
</td>
</tr>
</table>
//Js
$("input:checkbox.infoCheck").on( 'change', function() {
var objectEvent=$(this); //ok
var objEvnt = $(this).parents(".rowProducts");
if(objEvnt.find(".tr_hidden").is(":visible")){
objEvnt.find(".tr_hidden").hide('slow');
}
else{
objEvnt.find(".tr_hidden").show('slow');
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment