Visualizzazione dei risultati da 1 a 7 su 7

Visualizzazione discussione

  1. #1
    Utente di HTML.it
    Registrato dal
    Aug 2016
    Messaggi
    10

    Javascript e modal bootstrap

    Ho creato un bottone per la creazione di un box modale tramite bootstrap che passa variabili di un prodotto tramite il data-*
    codice:
    <button id="bottonI" type="button" class="btn btn-success" data-toggle="modal" 
    data-target="#exampleModal" 
    data-nome="'.$riga[1].'" 
    data-categoria="'.$riga[2].'" 
    data-condizione="'.$riga[3].'" 
    data-immagine="'.$riga[4].'" 
    data-informazioni="'.$riga[5].'"
    >Info</button>
    Il bottone si collega ad uno script javascript:
    codice:
    $('#exampleModal').on('show.bs.modal', function (event) {
            var button = $(event.relatedTarget);
            var nome = button.data('nome');
            var modal = $(this);
        
        var button = $(event.relatedTarget);
            var categoria= button.data('categoria');
            var modal = $(this);
        
        var button = $(event.relatedTarget);
            var condizione= button.data('condizione');
            var modal = $(this);
        
        var button = $(event.relatedTarget);
            var immagine= button.data('immagine');
            var modal = $(this);
        
        var button = $(event.relatedTarget);
            var informazioni= button.data('categoria');
            var modal = $(this);
        
            modal.find('.modal-title').text(nome);
            
        });
    all'interno della variabile "immagine" c'è il percorso dell'immagine che andrà poi posizionata all'interno del modal, però non ho la minima idea di come si possa mettere un'immagine tramite il javascript...
    Questo è invece il modal di riferimento:
    codice:
    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <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="exampleModalLabel"></h4>
                </div>
                <div class="modal-body">
                        <div class="form-group">
                            <label for="recipient-name" class="control-label">immagine:</label>
                            <img src="QUA CI ANDREBBE IL LINK ALL IMMAGINE" height="10%" width="40%">
                        </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Send message</button>
                </div>
            </div>
        </div>
        </div>
    Ultima modifica di manitta; 21-08-2016 a 17:04

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.