Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » PHP » añadir un boton en una mapa de imagenes

PHP - añadir un boton en una mapa de imagenes

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil

añadir un boton en una mapa de imagenes

Publicado por Jose (7 intervenciones) el 01/03/2017 20:53:08
tengo una duda, que me tiene atascado, estoy intentando que dentro de una mapa de imagenes en unas coordenadas añadir un boton pero no hay manera, la idea es que segun donde haga click se vincule con un producto y lo añada a un carro, he intentado a traves onclick llamar a la funcion pero no me devuelve nada, asi que habia pensado que hacerlo a traves de un boton que si he conseguido que me añada el producto a la cesta, pero ahora tengo que meterlo en el codigo del map y no hay manera...

1
<button type="button" data-name="prueba" item_id="product-0201" value="01" class="btn btn-img btn-flat product"></button>

Y lo quiere añadir aqui...

1
<area shape="rect" coords="223,112,297,136"  href="........")" >
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 kip
Val: 2.325
Plata
Ha disminuido 1 puesto en PHP (en relación al último mes)
Gráfica de PHP

añadir un boton en una mapa de imagenes

Publicado por kip (877 intervenciones) el 02/03/2017 01:07:44
Hola, puedes intentar haciendolo con javascript, debes recordar que a cada elemento del mapa deberias agregarle algun dato que identifique a este y que sirva de referencia para lograr la vinculacion al producto y añadirlo al carrito, yo haria algo asi:

1
2
3
4
5
6
7
8
9
10
11
12
<area data-id-product="producto-2-id-4324234" shape="rect" coords="0,0,297,136" alt="Producto 2" href="#"> ......
 
//Codigo javascript

<script>
    var elementos = document.querySelectorAll('area');
    for (var i = 0, s = elementos.length; i < s; i++) {
        elementos[i].addEventListener('click', function() {
            var dato = this.getAttribute('data-id-product');
            alert('Con este valor puedes hacer una llamada a ajax, obtener el detalle del producto y agregarlo al carrito.... -> ' + dato);
        });
    };
</script>

Deberias hacer uso de AJAX para guardar los detalles del producto en el carrito desde el servidor, avisanos si es lo que necesitas.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar