JQuery - Pasar imagen a ventana modal

 
Vista:

Pasar imagen a ventana modal

Publicado por Xavi (1 intervención) el 19/11/2021 13:53:44
Buenos días a todos,

Estoy intentando abrir una ventana modal con una imagen ampliada cuando hagan click en la miniatura de la imagen del listado de productos, pero he conseguido la ventana modal, pero no consigo que pase el src de la imagen al modal, este es el codigo que tengo:

la imagen del listado de productos:

1
$imagen = "<img id='myImg' src='".$productos[$i]["imagen"]."' width='40px' data-toggle='modal' data-target='#modalAmpliarImagen'>";

la ventana modal del html:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<div id="modalAmpliarImagen" class="modal fade" role="dialog">
 
            <div class="modal-dialog">
 
              <div class="modal-content">
 
                <form role="form" method="post" enctype="multipart/form-data">
             <!--=====================================
                  CABEZA DEL MODAL
                  ======================================-->
 
                  <div class="modal-header" style="background:#3c8dbc; color:white">
 
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
 
                    <h4 class="modal-title">Imagen</h4>
 
                  </div>
 
 
                <div class="modal-body">
                  <img src="" id="img01" style="width: 500px; height: 264px;" >
 
                </div>
 
 
                <div class="modal-footer">
                  <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
                </div>
 
              </div>
            </div>
          </div>
 
      </form>

y el js donde intento pasar el .src al nuevo modal:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
/*=============================================
AMPLIAR IMAGEN
=============================================*/
 
$(".tablaProductos tbody").on("click", "img.myImg", function(){
 
 
	var imagen = $(this).src("myImg");
 
 
		$(".img01").attr("src", 'imagen');
 
 
})


No se donde está el error , he intentado cambiar varias cosas pero el src de la ventana modal.

Un saludo,
Xavi
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro

Pasar imagen a ventana modal

Publicado por Alejandro (15 intervenciones) el 06/09/2022 18:07:13
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
La linea 11 en el ultimo código
1
$(".img01").attr("src", 'imagen');

te dejaría algo como esto
1
<img src="imagen" class="img01" />

Estas pasando imagen como una literal y no como variable.
1
$(".img01").attr("src", imagen);
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar