Jump to content
alysson122010

Botão de status

Recommended Posts

Gostaria de saber como fazer um botão de status. Tipo ta la ativo ai quando eu clicar nesse botão ele mude e fique desativado e se eu clicar novamente fique ativado.

Sem da refresh na pagina e esse botao envie para meu banco de dados e altere o status na tabela com o id do post.

Como eu faço isso nao tenho ideia.

Share this post


Link to post
Share on other sites

 

 

1- Temos um botão escrito Ativar, com id "btn" , e uma input com o status, sendo 0=Inativo e 1=Ativo:

<button id="btn" >Ativar</button>
<input id="status" type="hidden" value="0" />

2- Usando Jquery, iremos mudar o texto do botão e enviar um post para algum arquivo php:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<script>

   $("#btn").on('click',function(){
   
     var v = $("#status").val();
     
     if(v == 1){
       // está atualmetne ativo, vamos desativar
       $("#status").val(0);      // seta status para 0
       $("#btn").text('Ativar'); // Mudamos o texto do botão
     }else if(v == 0){
       // está desativado, vamos ativar
       $("#status").val(1);      // seta status para 1
       $("#btn").text('Desativar'); // Mudamos o texto do botão
     }
     
     // vamos enviar um post para um arquivo php
     
     $.post('dir/arquivo.php',{status:v},function(data){
     	console.log(data);
     });
   
   });
  
</script>

No arquivo php, basta receber o status e mudar no banco de dados:

<?php 

 if(isset($_POST['status'])){
   
  $status = trim($_POST['status']); 
   
  // mudar status no banco de dados
     
 }

?>

 

Share this post


Link to post
Share on other sites

Eu conseguir fazer. Pesquisei muito:

 

Index.php

 

<?php include('config.php');?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<?php
        $list = mysqli_query($conn, "SELECT * FROM botao");
            while($row = mysqli_fetch_assoc($list)){
?>

<form id="form<?php echo $row['id'];?>" name="form<?php echo $row['id'];?>" method="post" action="">
 
<?php echo $row['nome'];?> - 
<input name="id" type="hidden" id="id" value="<?php echo $row['id'];?>"/>
<input type="submit" id="button<?php echo $row['id'];?>" value="<?php echo $row['status'];?>" />
</form>
<script>
/*Botao*/


/*Enviar dados*/
$(document).ready(function(){
      $("#button<?php echo $row['id'];?>").click(function(e){
jQuery(document).ready(function(){
if(document.getElementById("button<?php echo $row['id'];?>").value == "Ativo"){
  document.getElementById("button<?php echo $row['id'];?>").value = "Inativo";

 }else{
  document.getElementById("button<?php echo $row['id'];?>").value = "Ativo";
 }
   });
    });
        jQuery('#form<?php echo $row['id'];?>').submit(function(){
            var dados = jQuery( this ).serialize();

            jQuery.ajax({
                type: "POST",
                url: "processa.php",
                data: dados,
                success: function( data )
                {
                    
                }
            });
            
            return false;
        });
    });
</script>
<?php }?>

 

 

processa.php

 

<?php 
include('config.php');
$id = $_POST['id'];
$list = mysqli_query($conn, "SELECT * FROM botao WHERE id = '$id'");
            while($row = mysqli_fetch_assoc($list)){
            if($row['status']=='Ativo'){
    $update = mysqli_query($conn, "UPDATE botao SET status = 'Inativo' WHERE id = '$id'");
    }else{
    $update = mysqli_query($conn, "UPDATE botao SET status = 'Ativo' WHERE id = '$id'");
        }
    }
?>
 

Config.php

 

<?php
error_reporting(0);
ini_set("display_errors", 0 );
$servidor = "localhost";
$usuario = "root";
$senha = "";
$dbname = "teste";

//Criar a conexao
$conn = mysqli_connect($servidor, $usuario, $senha, $dbname);
?>

 

Tabela sql

 

-- Estrutura da tabela `botao`
--

CREATE TABLE `botao` (
  `id` int(11) NOT NULL,
  `nome` text NOT NULL,
  `status` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

--
-- Extraindo dados da tabela `botao`
--

INSERT INTO `botao` (`id`, `nome`, `status`) VALUES
(1, 'Jose', 'Ativo'),
(2, 'Lucas', 'Ativo');

 

 

Agora eu gostaria de saber como posso fazer para o botao ficar verde quando tiver ativado e vermelho quando tiver inativo?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By adamo marinho
      Estou tentando achar numeros iguais dentro de arrays criadas usando a função array_intersect, porem para facilitar o meu projeto, precisaria incluir variaveis dentro das arrays, alguem pode ajudar por favor?

      <?php $v1_1 = 1; $v1_2 = 2; $v1_3 = 3; $v1_4 = 4; $v1_5 = 5; $v1 = array($v1_1, $v1_2, $v1_3, $v1_4, $v1_5); $v2_1 = 6; $v2_2 = 7; $v2_3 = 8; $v2_4 = 9; $v2_5 = 10; $v2 = array($v2_1, $v2_2, $v2_3, $v2_4, $v2_5); $v3_1 = 10; $v3_2 = 9; $v3_3 = 8; $v3_4 = 7; $v3_5 = 6; $v3 = array($v3_1, $v3_2, $v3_3, $v3_4, $v3_5); $v4_1 = 5; $v4_2 = 4; $v4_3 = 3; $v4_4 = 2; $v4_5 = 1; $v4 = array($v4_1, $v4_2, $v4_3, $v4_4, $v4_5); $resultado = array_intersect($v1, $v2, $v3, $v4 ); var_dump($resultado); ?>
    • By babylon
      Ola amigos,
       
      Estava querendo criar algo para meu site, um botao igual do site abaixo para calcular formas de pagamento "ver formas de pagamento":
       
      https://www.chipart.com.br/pc-gamer-level-one-black-amd-3400g
       
      Segue imagem em anexo.
       
      Alguem poderia me ajudar se tem algum script algo pronto ou que ajude para abrir pop up modal?
       
      Obrigado a todos.
       
       

    • By srs1999_
      Tópico
       
      Site em Código
      Sobre desenvolver sites sem o wordpress que ja tá tudo ali feito que seja um site dinâmico ou seja com banco de dados , APIs de pagamento, Painel para o usuário ,  além de todas  as funções que tem no wordpress e você teria propriedade pra explicar sobre detalhes mais técnicos da produção onde no wordpress só quem entende de progrqmação explicaria algum detalhe técnico 
      Então usando basicamente : 
      FRONT END 
      HTML 
       CSS 
      JAVASCRIPT 
      ALGUMA DE BACKEND COMO PHP E BANCO DE DADOS
      Pode se criar sites/sistemas tão bons ou melhores que no wordpress
       
      Fato : o proprio wordpress é feito em php e ate o proprio facebook tbm em php
      Fato 2 :  cerca de 70% dos sites são feitos em Wordpress
       
      Acho esse lance de procurar o caminho mais fácil limita muito a pessoa por exemplo é facil editar imagens no paint bem intuitivo , agora para editar no photoshop com muitas outras possibilidades  acaba sendo importante ir explorando essa elaboração mais difícil  com um mesmo objetivo. No caso do exemplo ( editar imagens )  
       
      Reflexão:
      Vale a pena se dedicar a trabalhar com a ferramenta Wordpress apenas por ser um meio rápido de ganhar dinheiro ?
      Ou trabalhar sem wordpress  usando tudo que exigido pra criar coisas originais mais que não seria tão rápido a produção. Mas creio que além dos sites feitos também geraria a possibildade de vender o sistema web criado para o cliente personalizar .
       
      Você Desenvolveria de que forma :
       Wordpress apenas ?
       
      Conhecer programação pra trabalhar 
      com  Wordpress ?
       
      Produzir tudo só com programação totalmente dinâmico sem  Wordpress?
    • By violin101
      Caros amigos
       
      saudações...
       
      Peço desculpa, se postei minha dúvida em local errado.
       
      Tenho um formulário onde valido todos os campos e após clicar no BUTTON para adicionar, tenho uma função que muda o TITLE e deixa desabilitado.
       
      O problema é o seguinte:
      - caso algum campo fica em branco, após validar o formulário e mudar o BUTTON, não consigo depois de preenchido HABILITAR novamente o button.
       
      Observação:
      1) após preencher o campo que ficou em branco, como faço para HABILITAR o button novamente e mudar o title do button ?
       
       
      na VIEW está assim:
      <form action="<?php echo current_url(); ?>" id="frmEstoque" method="post" onsubmit="this.btn_adc.disabled=true;" > <div class="card-body"> <div class="row"> <!---Todos os campos do Formulário---> </div> </div> <div class="card-footer" style="text-align:center;"> <input type="hidden" id="idCli" name="idCli" value="<?php echo $cliente->idClientes; ?>" /> <a href="<?php echo base_url() ?>admin/estoque" id="" class="btn btn-danger"><i class="fa fa-undo"></i> Voltar</a> &nbsp; <button type="submit" id="btn_adc" name="btn_adc" class="btn btn-primary">Adicionar</button> </div> </form>  
      na JavaScript está assim:
      <script> //Função para Mudar o VALUE do Button Adicionar Veículo document.getElementById("btn_adc").addEventListener("click",function(){ this.innerHTML = this.value++ || 'Aguarde...'; },false); </script> /* Observação: 1) como removo a função acima, após validar o formulário e esse encontrar algum campo vazio. 2) após preencher o campo que ficou em branco, HABILITAR o button novamente. */ <script type="text/javascript"> $(document).ready(function(){ //Função para Validar Formulário $('#frmEstoque').validate({ rules :{ etq_categcars:{ required: true}, etq_destaq:{ required: true}, etq_status:{ required: true} }, messages:{ etq_categcars :{ required: '<span style="color:#ff0000;">Campo Requerido</span>'}, etq_destaq :{ required: '<span style="color:#ff0000;">Campo Requerido</span>'}, etq_status :{ required: '<span style="color:#ff0000;">Campo Requerido</span>'} }, errorClass: "help-inline", errorElement: "span", highlight:function(element, errorClass, validClass) { $(element).parents('.form-group').addClass('error'); }, unhighlight: function(element, errorClass, validClass) { $(element).parents('.form-group').removeClass('error'); $(element).parents('.form-group').addClass('success'); } }); //Status dos Botões ADICIONAR - iniciar como desabilitado. document.getElementById("btn_adc").disabled = true; }); function statusButton(){ //valida conteudo do input if ($("input[name=etq_vlrcpr]").val() != 0 && $("input[name=etq_vlrvda]").val() != 0) { //habilita o botão document.getElementById("btn_adc").disabled = false; } else { //desabilita o botão se o conteúdo do input ficar em branco document.getElementById("btn_adc").disabled = true; } } </script>  
      Grato,
       
      Cesar
       
       
       
       
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.