ajax update modal

asdexiva · 1 Septiembre 2019, 19:50 PM

buenos dias,tardes,noches pudieran ayudarme con esto porfavor

tengo esto en mi clase clase_user.php

function update ($id,$nombre,$apellido,$oficio){

	$update=$this->bd->query("UPDATE clientes set nombre='$nombre',apellido='$apellido',oficio='$oficio' where id='$id'");
     $afectados=$this->bd->affected_rows;
     return $afectados;
	}

en mi js llamado guardar.js tengo esto

Código [Seleccionar]

function modificar (){
       
    var parametros= $('#datos').serialize(); 
    
    $.ajax({
        data: parametros,
        url:  'ajax/modificar.php',
        type: 'post',
        success: function (response){
         $('#respuesta').html(response)
        
         cargar();

        }


    });

          }

en mi archivo modificar tengo esto

Código [Seleccionar]

<?php 
include_once '../config/clase_user.php';


$usuarios= new usuarios();




$caja=$usuarios->update($_POST['nombre'],$_POST['apellidos'],$_POST['oficio']);
if ($caja==1) {

	echo"CONEXION EXITOSA";
}else {
	echo"Ract FALLIDO";
}



 ?>

en mi vista tengo esto

Código [Seleccionar]

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">

    <title>Hello, world!</title>
  </head>
  <body onload="cargar()">
  <?php  
 
  ?>
     <div id="respuesta"></div>
  <form id="datos" autocomplete="off">
  <div class="form-group">
    
    <label>Nombre</label>
    <input type="text" class="form-control" id="nombre" name="nombre"  placeholder="Name" >
  </div>
  <div class="form-group">
    <label>Apellidos</label>
    <input type="text" class="form-control" id="apellidos" name="apellidos"  placeholder="Name" >
  </div>
  <div class="form-group">
    <label>Oficio</label>
    <input type="text" class="form-control" id="oficio" name="oficio"  placeholder="Name" >
  </div>


  <button type="button" onclick="guardar()" class="btn btn-dark">Enviar</button>

</form>
     <table class="posclas table">
  <thead class="thead-dark">
    <tr>
      <th scope="col">Nombre</th>
      <th scope="col">Apellido</th>
      <th scope="col">Oficio</th>
   
    </tr>
  </thead>
  <tbody id="cargar">
    
    
  </tbody>
</table>

<div class="modal fade" id="modalEdicion" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

  <div class="modal-dialog modal-sm" 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">Actualizar datos</h4>
      </div>
      <div class="modal-body">
          <input type="text" id="id" name="id">
          <label>Nombre</label>
          <input type="text" name="nombre" id="nombre" class="form-control input-sm">
          
          <label>apellidos</label>
          <input type="text" name="apellidos" id="apellidos" class="form-control input-sm">
<label>oficio</label>

          <input type="text"  name="oficio" id="oficio" class="form-control input-sm">
          
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-warning" onclick="modificar()" id="actualizadatos" data-dismiss="modal">Actualizar</button>
        
      </div>
    </div>
  </div>
</div>
    

    <!-- Optional javascript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/guardar.js"></script>
  </body>
</html>

mi pregunta es como podria pasar esos valores al modal que viene ahi adentro por mas que trato no puedo comprender esta parte en ajax,gracias

Agente Naranja · 3 Septiembre 2019, 10:06 AM

No terminé de entender muy bien la pregunta, quieres que los datos que la persona meta en el formulario aparezcan también dentro del modal, antes o después de la consulta a la base de datos? Si es antes, simplemente copia los valores usando algo como document.getElementById('nombre').value y copiando este valor dentro del modal, por ejemplo $('#nombre', '#modalEdicion').value(...), no recuerdo si en jQuery es value() o val().

Eso sí, veo que estás usando dos veces el mismo nombre de ID, eso no es correcto. Tienes un input con id 'nombre' en el formulario y otro dentro del modal, te va a dar problemas a la hora de escribir los selectores de jQuery.

También veo que no estás haciendo ninguna limpieza de las variables, o sea que directamente tomas el $_POST['nombre'] y las demás variables y las metes en la consulta a la DB, eso no es muy correcto tampoco, puedes dejar agujeros de seguridad por donde una persona experta te meta un código malicioso y te borre cosas de la DB.

Si explicas un poco mejor lo que quieres hacer, a lo mejor alguien te puede dar ejemplos de código

Test Foro de elhacker.net SMF 2.1

ajax update modal

asdexiva

Agente Naranja