Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di exFelino
    Registrato dal
    Jul 2014
    residenza
    Aci Catena (CT)
    Messaggi
    623

    Bootstrap alert: usare lo stesso div per due messaggi consecutivi

    Ciao ragazzi,
    ho creato una semplice funzione che richiamo per visaulizzare dei messaggi all'utente:
    codice:
    function showMessageEvent(textToShow, cssClass) {
        $("#resultMessageEvent").fadeOut("slow", function () {
            $("#resultMessageEvent").addClass(cssClass);
            $("#resultMessageEvent").html(textToShow);
        });
    
    
        $("#resultMessageEvent").show("slow").delay(3000).fadeOut("slow", function () {
            $("#resultMessageEvent").removeClass(cssClass);
            $("#resultMessageEvent").html("");
        });
    }
    Esempio:
    Primo messaggio:
    showMessageEvent("Caricamento in corso...", "alert-warning");

    Se la chiamata Ajax è success, il secondo messaggio:
    showMessageEvent("Evento aggiornato!", "alert-success");

    Succede che vengono rimossi la classe e il test riferiti al caso warning e solo dopo viene visualizzato il div success senza testo!

    Come mai?

    Grazie.

  2. #2
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,614
    Ciao, perchè stati eseguendo 2 funzionalità allo stesso momento. Dovresti quindi fare tutto in cascata
    codice:
    function showMessageEvent(textToShow, cssClass) {
        $("#resultMessageEvent").fadeOut("slow", function (this) {
            $(this).addClass(cssClass).html(textToShow); //aggiungi classe
    		$(this).show("slow").delay(3000).fadeOut("slow", function () {
            $(this).removeClass(cssClass).html("");        
        });        
    });  
    }

  3. #3
    Utente di HTML.it L'avatar di exFelino
    Registrato dal
    Jul 2014
    residenza
    Aci Catena (CT)
    Messaggi
    623
    Giusta osservazione!

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 © 2019 vBulletin Solutions, Inc. All rights reserved.