Ir para conteúdo

Arquivado

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

JapahReturN

Trazer os dados no update com ajax/jquery me ajudem pf

Recommended Posts

Galera estou fazendo um sistema em ajax/jquery... com modal... está enviando normal e update tbm.....


Porém quando aperto em editar gostaria que as inputs viessem com os dados que já estão no banco para ficar mais fácil de editar... como faço isso?

Tentei varias formas mas não consigo acertar o script ajax com o arquivo php... obs: o mesmo modal de enviar é o do update


Index.php
 

<!DOCTYPE html>
<html>
<head>
  <title>Ajax</title>

  <link rel="stylesheet" href="bootstrap-3.3.7/css/bootstrap.min.css">

  <link href="CodeSeven-toastr/css/toastr.css" rel="stylesheet" type="text/css" />


</head>
<body>
  <br /><br />
  <div class="container">

    <div align="right">
      <!-- Button trigger modal -->
      <button type="button" class="btn btn-primary btn-lg" id="btn_add" data-toggle="modal">
        Add
      </button>
    </div>

    <div class="row">

      <div id="select"></div>

    </div>


  </div>
</body>
</html>

<!-- Modal -->
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"></h4>
      </div>
      <div class="modal-body">

        <form id="form" method="post" enctype="multipart/form-data">
          <p><label>Titulo</label>
            <input type="text" name="titulo" id="titulo" /></p><br />
            <p><label>Subtitulo</label>
              <input type="text" name="subtitulo" id="subtitulo" /></p><br />
              <p><label>Select Image</label>
                <input type="file" name="image" id="image" /> </p><br />

                <input type="hidden" name="action" id="action" />

                <input type="hidden" name="id" id="data_id" />

              </div>
              <div class="modal-footer">
                <button type="submit" id="enviar" class="btn btn-success"><i class="fa fa-tags"></i>Vai dar certo</button>
              </form>
              <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
            </div>
          </div>
        </div>
      </div>


      <script src="jQuery/jquery-3.2.1.js"></script>

      <script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>

      <script src="CodeSeven-toastr/js/toastr.js"></script>
      <script src="CodeSeven-toastr/custom-alert.js"></script>


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

        show_data(); 

        function show_data(){
          var $select = "select";
          $.ajax({
            url:"_appadmin/ajax/bannerModel.php",
            method:"POST",
            data:{action:$select},
            success:function(data){
              $('#select').html(data);
            }
          })
        }

        $('#btn_add').click(function(){  
          $('#modal').modal('show');
          $('.modal-title').text("haaaaaaaaaaaa");
          $('#form')[0].reset();
          $('#data_id').val('');  
          $('#action').val('insert'); 
        });


        //VALIDAÇÕES PARA LARGURA E ALTURA DA IMAGEM
        var _URL = window.URL || window.webkitURL;
        $("#image").change(function (e) {
          var $ext = $('#image').val().split('.').pop().toLowerCase();
          var $size = document.getElementById("image").files[0];
          var file, img;   

          if ((file = this.files[0])){
            img = new Image();
            img.onload = function () {
              if (jQuery.inArray($ext, ['jpg','jpeg','png']) == -1){ 
                $('#image').val('');
                toastr["error"]("", "Formato inválido!");
                return false;
              } else if ($size.size > 10485760){  
                $('#image').val('');
                toastr["error"]("", "Imagem muito grande!");
                return false;
              } else if (this.width < 1680 || this.height < 690){ 
                $('#image').val('');
                toastr["error"]("Está imagem deve conter pelo menos 1680px por 690px..", "");
                return false;
              }

            };

            img.src = _URL.createObjectURL(file);
          }
        });


        $('#form').submit(function(event){ 
          event.preventDefault();
          var $titulo = $('#titulo').val();
          var $subtitulo = $('#subtitulo').val();
          var $image = $('#image').val();

          //VALIDAÇÕES
          if ($image == ''){
            toastr["error"]("", "Um banner precisa de imagem.. ");
            return false;

          } else {
            $.ajax({
              url:"_appadmin/ajax/bannerModel.php",
              method:"POST",
              data:new FormData(this),
              contentType:false,
              processData:false,
              success:function(data){
                show_data();  
                toastr["success"](" ", "Adicionado com sucesso!");
                $('#form')[0].reset();
                $('#modal').modal('hide');
              }
            });
          }

        });


        $(document).on('click', '.update', function(){

          $('#data_id').val($(this).attr("id"));

          $('#modal').modal("show");
          $('.modal-title').text("EDITAAR");
          $('#action').val("update");
        });


        $(document).on('click', '.delete', function(){

          var $id = $(this).attr("id"); 
          var $delet = "delete";

          if(confirm("Tem certeza que deseja remover este banner?")){
            $.ajax({
              url:"_appadmin/ajax/bannerModel.php",
              method:"POST",
              data:{id:$id, action:$delet}, 
              success:function(data){
                show_data();
                toastr["success"](" ", "Removido com sucesso!");
              }
            })
          } else {
            return false;
          }
        });



      });

      </script>

 

PHP
 

<?php

include "Connection.class.php";

if(isset($_POST["action"])){

  if($_POST["action"] == "select"){
    $stmt = $conn->prepare("SELECT * FROM tb_banner ORDER BY id DESC");
    $stmt->execute();

    while($row = $stmt->fetch()){
      print '<div class="col-md-3">

      <img src="../uploads/banner/'.$row['_image'].'" class="img-responsive" />

      <h4>'.$row["id"].'</h4>

      <h2>'.$row["_titulo"].'</h2>

      <h3>'.$row["_subtitulo"].'</h3>

      <button type="button" name="update" class="btn btn-warning bt-xs update" id="'.$row["id"].'">Editar</button><br>
      <button type="button" name="delete" class="btn btn-danger bt-xs delete" id="'.$row["id"].'">Remover</button>

      </div>';
    }

  }

  if($_POST["action"] == "insert"){

    $titulo = $_POST["titulo"];
    $subtitulo = $_POST["subtitulo"];

    //PEGA A EXTENSÃO DA IMAGEM
    $tmp = explode('.', $_FILES['image']['name']);
    $ext = strtolower(end($tmp));
    $validas = array('jpeg', 'jpg', 'png');

    //RENOMEIA A IMAGEM
    date_default_timezone_set('America/Sao_Paulo');
    $newName = date("His") . date("dmy") . "." . $ext;

    //PASTA DE DESTINO
    $destino = "../../../uploads/banner/" . $newName;


    //VALIDAÇÕES SERVERSIDE
    if($_FILES['image'] == null){

      return false;

    } else if(!in_array($ext, $validas)){ //se a extensão não for valida

      return false;

    } else if ($_FILES['image']['size'] > 10485760){ //se for maior que 10mb permitido

      return false;

    } else {

      //MOVE ELA PARA A PASTA DE DESTINO
      move_uploaded_file($_FILES['image']['tmp_name'], $destino);

    }


    $stmt = $conn->prepare('INSERT INTO tb_banner (_titulo, _subtitulo, _image) VALUES (:titulo, :subtitulo, :image)');

    $stmt->bindParam(':titulo', $titulo);
    $stmt->bindParam(':subtitulo', $subtitulo);
    $stmt->bindParam(':image', $newName);

    $stmt->execute();


  }

  if($_POST["action"] == "update"){

    $stmt = $conn->prepare("SELECT * FROM tb_banner WHERE id = :id LIMIT 1");
    $stmt->execute(array(':id'	=>	$_POST["id"]));

    $return = array();

  	$result = $statement->fetchAll();

  	foreach($result as $row){
  		$return["titulo"] = $row["_titulo"];          
  		$return["subtitulo"] = $row["_subtitulo"];
      

  	}

  	echo $return;




  }

  if($_POST["action"] == "delete"){

    $stmt = $conn->prepare("SELECT _image FROM tb_banner WHERE id = :id"); 
    $stmt->execute(array(':id'	=>	$_POST["id"]));
    $name = $stmt->fetch();

    unlink("../../../uploads/banner/$name[0]");  


    $stmt = $conn->prepare("DELETE FROM tb_banner WHERE id = :id"); 
    $stmt->execute(array(':id'	=>	$_POST["id"]));



  }




}

?>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por Thiago Duarte
      Oi, gostaria de arrastar imagem e ao soltar formar bloco html, meu bloco de html ficaria com nome, content-1.html, content-2.html, etc
       
      Alguem pode me ajudar?
    • Por unset
      Olá, estou enfrentando um problema e ainda não consegui pensar em uma solução, como resolver o problema, eu estou mudando meu sistema para utilizar janelas modal do bootstrap 5, cadastro e edição e funciona bem, porém ao adicionar um editor de texto wysiwyg tipo ckeditor 4, tinymce, summernot, e outros nenhum deles abre o conteudo no textarea, não estou conseguindo entender o motivo, se eu retiro a chamada dos editores os dados são exibidos corretamente, se eu deixo os dados não são carregados, mais os editores abrem normal.
       
      alguem já passou por isso, tem alguma luz? obrigado desde já por qualquer ajuda.


    • Por ILR master
      Salve galera.
       
      Vou publicar um evento e quero colocar um Cronômetro regressivo que mostre em tempo real os dias, horas e minutos que faltam para determinada data, tipo:.
      Faltam 5 dias, 12:30:00 para inauguração.
       
      Qdo chegar no dia, quero que apenas apareça uma mensagem.
       
      Alguém pode me ajudar?
    • Por ment0r
      Boa noite pessoal, tudo bem?
       
      Estou desenvolvendo um sistema simples com exibição de formulário via modal. Uma vez cadastrado o serviço (tabela possui apenas dois campos, id e nome), eles são exibidos numa tabela com um ícone que permite a alteração do nome.

       
      Eu clico no ícone e é chamado um modal que é gerado via ajax (pois são vários registros).
       

       
      Nesse modal é mostrado o serviço e uma vez alterado, o botão Salvar chama uma função que atualiza a tabela servico, concluindo a tarefa. Fiz o mesmo processo pra cadastrar o serviço, com a diferença de que o modal está presente na mesma página, ou seja, não é chamado via ajax.
       
      Eis os códigos:
      <a href="#" onclick="modalUpdate(<?= trim($array['id']) ?>)"> <i class='bx bx-edit'></i> </a> // Trecho onde eu chamo a função modalUpdate. Função btAltServico click:
      $('#btAltServico').click(function() { var inpnome = $('#nome'); var inpid = $('#id'); if (inpnome.val() == '') { swal("Atenção", "Por favor, preencha os campos obrigatórios", "warning"); if (inpnome.val() == '') { inpnome.css("border","2px solid #f94545"); } else { inpnome.css("border",""); } alert(inpnome); alert(inpid); } else { $.ajax({ url: '../inc/ajax/altServico.php', type: 'post', dataType: 'json', // pode ser html data: { nome : inpnome.val(), id : inpid.val() }, success: function(resposta){ if (resposta == 1) { inpnome.val(""); inpnome.css("border",""); swal("Sucesso", "Serviço alterado", "success"); } else { if (resposta == 0) { swal("Erro", "Serviço não alterado. Log de erro gerado.", "error"); } else { swal("Atenção", "Serviço já cadastrado", "warning"); } } } }) } });  
      E modalUpdate.php :
       
      <?php /* * altServico.php * * Script responsável pelo update de serviços na tabela servico * * Função chamada pelo arquivo ajax.js */ //if ($_POST) { require'../conn.php'; require'../../class/class.geral.php'; $geral = new Geral(); $nome = $_POST['nome']; $id = $_POST['nome']; $ativo = 1; // Verifica se o servico já foi cadastrado $sqlVer = "select nome from algo68_db_cliente.servico where nome = '".$nome."' and id <> ".$id.""; $queryVer = mysqli_query($conn, $sqlVer); $resultVer = mysqli_num_rows($queryVer); if ($resultVer > 0) { echo json_encode(2); // servico já cadastrado } else { // Update do servico $sql = "update algo68_db_cliente.servico set nome = '".$nome."', ativo = ".$ativo." where id = ".$id; $query = mysqli_query($conn, $sql); $result = mysqli_affected_rows($conn); if ($result > 0) { echo json_encode(1); // alterou o servico } else { $geral->logErro(date('d/m/Y|H:i:s'), @$_SERVER[REQUEST_URI], 'AlterarServico', mysqli_error($conn)); echo json_encode(0); // não alterou o servico } } //} ?> O problema é que quando clico no botão Salvar, não acontece nada - se eu colocar um alert qualquer na função click, só pra saber se está chegando, também não da nada. E está da mesma forma que o cadastro de serviço, que funciona perfeitamente.

      Bom, é isso pessoal, tentei ser o mais breve e especifico possível. Qualquer ajuda é bem vinda, obrigado a todos, desde já.
×

Informação importante

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