[Resolvido] Botão Status (Ativo | Inativo)

[Inove 0]

Bom Dia,

Estou desenvolvendo uma aplicação que tem uma opção de ativar ou desativar a exibição dos registros que vem do mysql em um relatorio.

Preciso criar um botão que ativa e desativa fazendo update na tabela.

Sendo:

Se estiver ativo, ficar verde e se clicar ele ficar vermelho e da um update na tabela com o novo status.

Caso estiver inativo, ficar vermelho e se clicar ele ficar verde e da um update na tabela com o novo status.

 

Em PHP fiz isto mas com refresh da pagina, e não sei como fazer via ajax afim de evitar o refresh pois a tabela contem bastante registro.

 

Algum fez algo assim? preciso de ajuda pois não sei nem por onde começar!

Andei pesquisando na internet mas nao encontrei, creio que eu esteja procurando pelo termo errado.

 

Help me!

[William Bruno 1501]

Exemplo com jQuey:

 

http://wbruno.com.br/blog/2011/03/16/atualizar-sql-atraves-de-acao-em-checkbox/

[Inove 0]

Obrigado! Consegui resolver a questão utilizando o exemplo do seu site com algumas alterações. Vlw Mesmo!

[Inove 0]

Resolvi passar e deixar o código para que outros tambem possam fazer.

Quebrei muito a cabeça aqui, e acabei encontra essa certa "Gambiarra" e deu certo.

 

PHP UM - list.php

<script type="text/javascript">  
   $(document).ready(function(){  

	/* MB */
	$(".1").click(function(){  
           var $this = $( this );//guardando o ponteiro em uma variavel, por performance  

           var status = 0;  
           var id = $(this).attr('alt')  

           $.ajax({  
               url: 'ajax/clientes.php',  
               type: 'GET',  
               data: 'status='+status+'&id='+id,  
               success: function( data ){  
                   //alert( data ); 
				$("#a"+id).css({'display' :'none'});
				$("#d"+id).css({'display' :'inline'}); 
               }  
           });  
       });  

	$(".2").click(function(){  
           var $this = $( this );//guardando o ponteiro em uma variavel, por performance  

           var status =  1;  
           var id = $(this).attr('alt')  

           $.ajax({  
               url: 'ajax/clientes.php',  
               type: 'GET',  
               data: 'status='+status+'&id='+id,  
               success: function( data ){  
                   //alert( data ); 
				$("#a"+id).css({'display' :'inline'});
				$("#d"+id).css({'display' :'none'});
               }  
           });  
       });  

   });  
   </script>

<img src="<?=path;?>images/page_red.png" alt="<?=$id;?>" width="16" height="16" border="0" class="1" title="Desabilitar cliente" id="a<?=$id;?>" style="cursor:pointer; <? if($ativo==0){ echo "display:none;";} ?>">
<img src="<?=path;?>images/page.png" alt="<?=$id;?>" width="16" height="16" border="0" class="2"  title="Habilitar cliente" id="d<?=$id;?>" style="cursor:pointer; <? if($ativo==1){ echo "display:none;";} ?>">

 

PHP DOIS clientes.php

<? include("db.php");


       ini_set('display_errors', true);  
       error_reporting(E_ALL);  

       if( isset( $_GET['status'] ) )  
       {  
           $id = (int)getGet('id');  
           $sql = 'UPDATE `clientes` SET `ativo` = '.getGet('status').' WHERE `id` = '.$id;  


		mysql_query($sql);
		//echo $sql;//aqui você deve executar a query  
       }  
       function getGet( $key ){  
           return isset( $_GET[ $key ] ) ? filter( $_GET[ $key ] ) : null;  
       }  
       function filter( $str ){  
           return $str;//deixo a implementação desta por conta de vcs.  
       }  
	?>

[William Bruno 1501]

classes não devem começar com numeros.

 

dá uma estudada, tem como reduzir o script, para não haver essa duplicação de código.