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

Por , em Javascript

Recommended Posts

Nícolas Luís Huber    0

Nícolas Luís Huber
Postado

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

Ted k'    126

Ted k'
Postado

O amigo Bruno ajudou na correção mais veja o marcar todos:

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

 

Contar quantos já foram marcados:

http://scriptbrasil.com.br/forum/index.php?showtopic=140373&view=findpost&p=558281

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas Luís Huber    14

Nícolas Luís Huber
Postado

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

William Bruno    1501

William Bruno
Postado

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

Nícolas Luís Huber    14

Nícolas Luís Huber
Postado

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

William Bruno    1501

William Bruno
Postado

mesma coisa então, basta alterar isso aqui:

 

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

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas Luís Huber    14

Nícolas Luís Huber
Postado

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
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito