2

tengo un problema espero alguien me ayude ya intente de todo, pero al final después de todo soy nuevo en esto y me acabo de dar cuenta que no se permiten la repeticiones de id en los elementos html, en el botón que inicia liza la ventana modal tiene en el id el mismo nombre y este se ocupa para todos los productos cuando quiero mostrar la ventana modal no lo reconoce para cada producto sino que solo me muestra uno y siempre imprime el mismo valor del primero y no de cada uno, como puedo hacer un id dinamico tengo entendido que con la variable que guarda las filas en el while peor lo intente y nada este es mi codigo:

<div class=" row">
                                         <?php  $sel=$con->prepare("SELECT*FROM Producto where cod_catego1 =3 ");
                                         $sel->execute();
                                         $res=$sel->get_result();
                                         $row=mysqli_num_rows($res);

                                         while($f=$res->fetch_assoc()){

                                            ?>
                                         <div class="card col s3 ">
                                             <form action="index.php?action=add&code=<?php echo $f["cod_producto"]; ?>" method="post" class="for1">
                                                 <div class="card-image">
                                                 <img src="<?php echo $f['imagen'] ?>" width="50" height="180">
                                                 <!-- <span class="card-title">Card Title</span> -->
                                                 </div>
                                                 <div class="card-content  purple-text">
                                                     <p><?php echo $f['nombrep'] ?></p>
                                                     <p><?php echo $f['modelo'] ?></p>
                                                 </div>
                                                 <!-- <div class="card-action"> -->
                                                     <input type="number"  value="1" name="quantity" min="1"  class=" col s6 blue-text" autocomplete="off">
                                                    <input type="hidden" name="hidden_name" value="<?php echo $f["nombrep"]; ?>" />
                                                    <input type="hidden" name="hidden_price" value="<?php echo $f["precio"]; ?>" />
                                                    <button class="btn btn-floating orange" type="submit" name="add_to_cart"><i class="material-icons right">add_shopping_cart</i></button>
                                                    <button data-target="modal1" id="mod"  value="<?php echo $f["modelo"]; ?>"  class="btn modal-trigger"><i class="material-icons">visibility</i></button>

                                                     <div class="card-content">
                                                         <p class="red-text "><?php echo "$ ".number_format($f['precio'],2); ?></p>
                                                     </div>
                                                 </form>

                                             <!-- </div> -->

                                         </div>

                                         <!-- Modal Structure -->


                                         <?php

                                     }

                                     ?>

         </div><!-- fin de row container de pruductos-->

el boton con el valor id"mod" es el que se envia dependido de el código del producto selccionado de esta manera lo visualizo en una ventana modal peor solo me muestra el primero los demas no, poro lo mismo de que el id de el elemento html es el mismo, en esta parte capturo la variable enviada en el ajax:

<script>

  $('.modal').modal();// inicializo la ventana modal

$('#mod').click(function(){// parte dond edeveria capturar el click del boton  que cada tarjeta de producto tiene, utilizo la misma estructura para m,ostrar diferentes productos recorriendolo por un while
    $.get('modal.php',{// recibo variable del boton pormedio del mentodo get
            id:$('#mod').val(),//envio el valor de el boton
            beforeSend:function(){
                $('#res_modal').html("espere..");
            }
    },function(respuesta){
            $('#res_modal').html(respuesta);

    });
});

</script>

y mado la variable a una pagina llamada modal.php donde la recibo y ago una consulta para mostar los datos en una ventaan modal este es el codigo html d ela ventana modal:

<div id="modal1" class="modal"><!--mi evntana modal donde recibo la tabla que tengo en mi archivo modal.php-->
         <div class="modal-content">
             <h4 class="center">Caracteriscas</h4>

                 <div id="res_modal" class="col s12"><!--m a qui imprimo el contenido de cada id diferente de producto pero solo me detecta uno y los demas no los muetsra con caca click-->

                 </div>


                 </div>
                 <div class="modal-footer">
             <a href="#!" class="modal-close waves-effect waves-green btn-flat"><i class="material-icons red-">highlight_off</i></a>
         </div>
     </div>

este es el archivo adond eenvio la variable con ajax lo recibo promedio de get y realizo una consulta ala bd para traer la información dependiendo del id:

?php
include '../conexion/conexion.php';
$id = $con->real_escape_string(htmlentities($_GET['id']));
$sel = $con->prepare("SELECT *  FROM producto WHERE modelo = ? ");
$sel->bind_param('s', $id);
$sel->execute();
$res = $sel->get_result();

if ($f=$res->fetch_assoc()) {

 }

 ?>

 <!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <link rel="stylesheet" href="../css/materialize.min.css">
   <title>modal</title>
 </head>
 <body>
<h5 align="right"><b class="red-text"><?php echo "$". number_format($f['precio'], 2); ?></b></h5>
 <table class="centered responsive-table highlight  grey lighten-2" >

   <thead >
     <th>Modelo</th>
     <th>Descripcion</th>
   </thead>

   <tr>

     <td><?php echo $f['modelo'] ?></td>

     <td><?php echo $f['descripcion'] ?></td>
   </tr>


 </table>



 </body>
 </html>

1 respuesta 1

1

Muestra

$(function(){
  $(".ver").click(function(){
    var valor = $(this).attr('data-id')
    $("#resultado").html(valor)
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="ver" data-id="muestra 1">Ver Valor</button><br><br>
<button class="ver" data-id="muestra 2">Ver Valor</button><br><br>
<button class="ver" data-id="muestra 3">Ver Valor</button><br><br>
<button class="ver" data-id="muestra 4">Ver Valor</button><br><br>
<div id="resultado"></div>

porque mejor no trabajas con clases, igual estas repitiendo el id del boto, prueba algo asi:

<button data-target="modal1" value="<?php echo $f["modelo"]; ?>"  class="btn modal-trigger ver"><i class="material-icons">visibility</i></button>

    $('.ver').click(function(){
        $.get('modal.php',{
                id:$(this).val(),
                beforeSend:function(){
                    $('#res_modal').html("espere..");
                }
        },function(respuesta){
                $('#res_modal').html(respuesta);

        });
    });

de esa manera detecta es valor del botón al que se le de click monitoreando la clase ver

2
  • Muchas gracias si me ayudo, se resovio el problema te agradezco muchísimas gracias, esto me ayudraa seguir con mi proyecto gracias amigo saludos.
    – jose
    Commented el 7 may. 2018 a las 5:00
  • @jose de nada amigo, recuerda marcar la respuesta como solución para futuras referencias de toros usuarios, y éxitos en tu proyecto. Commented el 7 may. 2018 a las 6:29

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.