Ir para conteúdo

POWERED BY:

Arquivado

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

Nícolas Luís Huber

Contagem de Checkbox

Recommended Posts

Olá Comunidade iMasters. Estou querendo colocar em meu Sistema uma contagagem do número de checkbox. Tenho em uma página a lista dos produtos e ao lado de cada produto existe um input checkbox para poder excluir vários ao mesmo tempo. Eu quero fazer as contagens destes checkbox e exibir quantos foram selecionado no botão que faz a exclusão. Por exemplo, Apagar itens selecionados (5).

Outra opção que quero colocar é quando selecionar checkbox do top e seleceione todas. Não sei nada quase de JavaScript, alguém poderia me aconselhar a fazer este efeitos?? :clap: :clap:

Compartilhar este post


Link para o post
Compartilhar em outros sites

Compartilhar este post


Link para o post
Compartilhar em outros sites

Galera tive que criar uma conta nova, pois eu estava logando com o Facebook e não estava dando certo, pois em algumas página não era permitido criar respostas. Mas então vamos logo ao assunto:

 

Eu achei um script que faz a contagem dos checkbox, porém eu ele coloca o valor contado dentro de um span. Mas em meu caso quero colocar dentro de um do value de um input, segue o código:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>

<script>
var d = document;
function $( bloco )
{
   return d.getElementById( bloco );
}

function getItensSel()
{
   itens = 0;
   var oElementos = d.getElementsByTagName('input');
   for( var i = 0; i < oElementos.length; i++ )
   {
       if( oElementos[ i ].type == 'checkbox' )
       {
          if( oElementos[ i ].checked )
          {
             itens++;
          }
       }
   }

   $( 'total' ).innerHTML = itens;
}
</script>
</head>
<body onLoad="java script:getItensSel();">
<table width="100%"  border="1" cellspacing="1" cellpadding="1">
 <tr>
   <td><input type="checkbox" name="checkbox" value="checkbox" onClick="getItensSel()"></td>
 </tr>

 <tr>
   <td><input type="checkbox" name="checkbox" value="checkbox" onClick="getItensSel()"></td>
 </tr>
 <tr>
   <td><input type="checkbox" name="checkbox" value="checkbox" onClick="getItensSel()"></td>
 </tr>
 <tr>
   <td><input type="checkbox" name="checkbox" value="checkbox" onClick="getItensSel()"></td>
 </tr>

 <tr>
   <td>
       Itens marcados <span id="total">0</span>
   </td>
 </tr>
  <tr>
   <td>
       <input type="submit" name="enviar" id="total" value="0">

   </td>
 </tr>
</table>
</body>
</html>

 

Ted'k o script que me mostrou funcionou certinho

 

http://code.imasters.com.br/index.php?/topic/105-marcar-varios-checkbox/page__p__214#entry214

Compartilhar este post


Link para o post
Compartilhar em outros sites

basta trocar:

$( 'total' ).innerHTML = itens;

por:

$( 'total' ).value = itens;

 

e:

<span id="total">0</span>

por:

<input type="text" id="total" value="0" />

Compartilhar este post


Link para o post
Compartilhar em outros sites

Obrigado William, porém eu quero colocar esta contagem dentro de um input submit assim:

 

<input type="submit" id="total" value="Excluir Selecionados (0)" />

 

Por´me com isto ele não faz a contagem, como eu continuo?

Compartilhar este post


Link para o post
Compartilhar em outros sites

mesma coisa então, basta alterar isso aqui:

 

$( 'total' ).value = "Excluir Selecionados ("+itens+")";

Compartilhar este post


Link para o post
Compartilhar em outros sites

Obrigado a todos eu consegui usar. Porém, sempre com um porém, apenas em página sozinha, quando fui colocar em meu projeto consegui apenas com sucesso a contagem de checkbox, segue os códgios:

 

Funções de script (header.php)

<script type="text/javascript">
function id( el ){
       return document.getElementById( el );
}
function marcarCheck( id_fieldset, el ) 
{
   var checks = id( id_fieldset ).getElementsByTagName('input');
       for ( var i=0; i<checks.length; i++) 
       {
               if ( checks[i].type == 'checkbox' ) 
                       checks[i].checked = el.checked;
       }
}
window.onload = function()
{
       id('CheckTodos').onclick = function()
               marcarCheck( 'todos', this );
}
</script>
<script type="text/javascript">
var d = document;
function $( bloco )
{
   return d.getElementById( bloco );
}

function getItensSel()
{
   itens = 0;
   var oElementos = d.getElementsByTagName('input');
   for( var i = 0; i < oElementos.length; i++ )
   {
       if( oElementos[ i ].type == 'checkbox' )
       {
          if( oElementos[ i ].checked )
          {
             itens++;
          }
       }
   }

   $( 'total' ).value = "Excluir Selecionados ("+itens+")";
}
</script>

 

Página que recebem as funções(listar.php)]

<div class="container" onLoad="java script:getItensSel();">
<form action="" method="post" enctype="multipart/form-data">
<fieldset id="todos">
<table width="100%" border="0"> 
<?php
$sql = mysql_query("SELECT * FROM produtos");
   if(mysql_num_rows($sql) == false){
  echo '<tr class="tr"><td align="center"><strong>Ops! Nenhum produto cadastrado!</strong></td></tr>';
}else{
?>
 <tr class="tops">
   <td width="8%" align="center"><input type="checkbox" name="CheckTodos" id="CheckTodos" /></td>
   <td width="15%" align="center">ID</td>
   <td width="67%">Produto</td>
   <td width="10%" align="center">Editar</td>
 </tr>  
 <?php
 $sql = mysql_query("SELECT * FROM produtos");
	while($ln = mysql_fetch_array($sql)){			
	 $id = $ln['id'];	
	 $nome = $ln['nome'];	
 ?>
 <tr class="tr">
   <td align="center"><input type='checkbox' name='check[]' value="<?php echo $id; ?>" onClick="getItensSel()" /></td>
   <td align="center"><?php echo $id; ?></td>
   <td><?php echo $nome; ?></td>
   <td align="center"><a href="#" title="Editar <?php echo $nome; ?>"><img src="<?php echo $url_base_config;?>/images/icons/editar-cinza.png" alt="" title="" /></a></td>
 </tr>  
 <?php
	} // While de Repetição
 ?> 
</table>
<input type="submit" name="excluir" id="total" value="Excluir Selecionados (0)" class="buttons-link-right"  />
</fieldset>
</form>

 

O problema que acontece são os seguintes:

  1. Não funciona a seleção de todas as CheckBox.
  2. Na contagem da Chekbox acaba contando a CheckBox que Seleciona todas.

Na verdade não estou conseguindo organizar o código, pois esta dentro de uma tabela que faz Loop do Banco de Dados. Alguém pode me ajudar a resolver??? :wacko: :wacko:

 

Vale ressaltar que o o script de marcar todos chekbox, tem erro de sintaxe. Porém não sei quase nada de JavaScript. Tenho que aprender!!!

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.