My Writings. My Thoughts.

Marcar checkbox na vertical e horizontal

On » quinta-feira, 28 de janeiro de 2010 // In »
Abaixo segue o código de como marcar checkbox (geralmente utilizado para dar permissão a usuários), é possível marcar tanto na horizontal como na vertical. Assim facilita a vida da pessoa que irá dar permissão.





<html>
<head>
<script>
function CheckAll(linha,chkStatus) { 
   for (var i=0;i<document.acessoUsuarioForm.elements.length;i++) {
     var x = document.acessoUsuarioForm.elements[i];
     
      if (x.name == 'chkIncluir'+linha ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
  if (x.name == 'chkAlterar'+linha ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
  if (x.name == 'chkExcluir'+linha ) {       
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
  if (x.name == 'chkPesquisar'+linha ) {       
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
 }
} 


function CheckAllCol(coluna,chkStatus) { 
 for (var i=0;i<document.acessoUsuarioForm.elements.length;i++) {
     var x = document.acessoUsuarioForm.elements[i];
     
     if(coluna == 1){
  if (x.id == 'chkIncluir' ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
 }
 
 if(coluna == 2){
  if (x.id == 'chkAlterar' ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
 }
 
 if(coluna == 3){
  if (x.id == 'chkExcluir' ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
 }
 
 if(coluna == 4){
  if (x.id == 'chkPesquisar' ) {
   if(chkStatus == true)
    x.checked = true;
   else
    x.checked = false;
  } 
 }

}
}

</script>


<style>
table.bordasimples tr td {border:1px solid darkblue;}
table tr.dif td {background: #4278B6; font-color=#FFF;}



body{
 font-color=#000000;
 font-family: arial, verdana; 
 font-size: 12px;"
}



</style>
</head>

<body >
<form name="acessoUsuarioForm">

<table border='0' align='center' cellpadding='3' cellspacing='5' class="bordasimples">

<tr class="dif">
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Menu</b></font></td>
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Incluir</b></font></td>
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Alterar</b></font></td>
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Excluir</b></font></td>
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Consultar</b></font></td>
 <td><font color=#ffffff style="font-family: arial, verdana; font-size: 12px;"><b>&nbsp;&nbsp;Marcar Permissão</b></font></td>
</tr>

<tr>   
 <td></td>
   <td align='center'><input type=checkbox name="selallI" onClick="JavaScript:CheckAllCol(1,this.checked);"></td>
  <td align='center'><input type=checkbox name="selallA" onClick="JavaScript:CheckAllCol(2,this.checked);"></td>
  <td align='center'><input type=checkbox name="selallE" onClick="JavaScript:CheckAllCol(3,this.checked);"></td>
 <td align='center'><input type=checkbox name="selallP" onClick="JavaScript:CheckAllCol(4,this.checked);"></td>
    <td>&#8592;Vertical &#8595;Horizontal </td>
</tr>


<tr>
  <td>
  Clientes
  </td>
  <td align='center'>
   <input type="checkbox" name="chkIncluir1" id="chkIncluir" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkAlterar1" id="chkAlterar" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkExcluir1" id="chkExcluir" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkPesquisar1" id="chkPesquisar"/>
  </td>
  <td align='center'>
   <input type=checkbox name="selall1" onClick="JavaScript:CheckAll(1, this.checked);">
  </td>
</tr> 

<tr>
  <td>
  Estoque
  </td>
  <td align='center'>
   <input type="checkbox" name="chkIncluir2" id="chkIncluir" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkAlterar2" id="chkAlterar" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkExcluir2" id="chkExcluir" />
  </td>
  <td align='center'>
   <input type="checkbox" name="chkPesquisar2" id="chkPesquisar"/>
  </td>
  <td align='center'>
   <input type=checkbox name="selall2" onClick="JavaScript:CheckAll(2, this.checked);">
  </td>
</tr>   
</table>
</form>
</body>
</html>

Postado por Daniel Negrisoli Batista às 14:48

No Response to "Marcar checkbox na vertical e horizontal"

Leave A Reply

My videos. Featured videos.

My photos. Now you know me.


Esse não sou eu, mas posso acabar sendo...

Browse Flickr

My lifestream. Stay updated with me.