[HTML] Modal Dialog + Loading Animation + Resize Modal Dialog

Stato
Chiusa ad ulteriori risposte.

c.capannini85

Nuovo Utente
23 Feb 2015
3
0
0
Salve,
il mio problema è questo allora in pratica vorrei creare una pagina web html5 o html con un pulsante : esso fa una chiamata ajax al server che mi risponderà o false o true se mi risponde false allora rimane l'animazione del loading se mi arriva true la modal dialog o modal dialog box nasconde l'animazione del loading e si allarga fino a mostrare un contenuto particolare che chiaramente è grande. Ma il mio problema sta solamente nel ridimensionare la dialog box da piccola a grande quando riceve la risposta true. Come posso fare?
Grazie
Cristian
 
ciao! non so se ti po essere ancora utile! ho trovato questo script. lo posto.
PHP:
<button  type="button"  class="btn btn-success btn-xs" data-toggle="modal" data-target="#view-modal" data-id="'.$idUser.'" id="getUser" >Edit</button>

HTML:
<!-- modal td -->         
<div id="view-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title"><i class="glyphicon glyphicon-user"></i> Dettaglio Turno</h4>
            </div>

            <div class="modal-body">

                <div id="modal-loader" style="display: none; text-align: center;">
                       <i class="fa fa-refresh fa-spin fa-3x fa-fw"></i>
                    <span class="sr-only">Loading...</span>
                </div>

                <!-- content will be load here -->                         
                <div id="dynamic-content"></div>

            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
            </div>

        </div>
    </div>
</div>

Codice:
<script>
$(document).ready(function(){
    
    //DETAILS CALENDAR TD
    $(document).on('click', '#getUser', function(e){
        
        e.preventDefault();
        
        var uid = $(this).data('id');   // it will get id of clicked row
        
        $('#dynamic-content').html(''); // leave it blank before ajax call
        $('#modal-loader').show();      // load ajax loader
        
        $.ajax({
            url: 'modal_ajax.php',
            type: 'POST',
            data: 'id='+uid,
            dataType: 'html'
        })
        .done(function(data){
            console.log(data);   
            $('#dynamic-content').html('');   
            $('#dynamic-content').html(data); // load response
            $('#modal-loader').hide();          // hide ajax loader   
        })
        .fail(function(){
            $('#dynamic-content').html('<i class="glyphicon glyphicon-info-sign"></i> Something went wrong, Please try again...');
            $('#modal-loader').hide();
        });
        
    });
</script>

crea una nuova pagina chiamata modal_ajax.php dove intercetti $_REQUEST['id']
 
il mio problema è se ho un altro modal con un form diverso e provo a replicare lo script non mi funziona!
aiuto please!
 
@Bunz,
Non riprendere post vecchi se hai un problema aprine uno nuovo con titolo e descrizione accurata del problema
 
Stato
Chiusa ad ulteriori risposte.

Discussioni simili