[JavaScript] Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

Dieses Thema im Forum "Webentwicklung" wurde erstellt von furious1, 29. Mai 2010 .

Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 29. Mai 2010
    Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

    Hallo,

    habe hier ein Skript mit einem Formular.

    Bsp:

    HTML:
    <?php
    
    if(isset($_POST['save'])) {
    
     # such mal die daten zusammen...
    
    }
    
    ?>
    
    <!-- JQUERY & BLOCKUI Plugin sind eingebunden! -->
    
    <script type="text/javascript">
    
     $(document).ready(function() {
     $('#submit_button').click(function() {
     $.blockUI({ message: '<h1><img src="img/busy.gif" /> Just a moment...</h1>'; 
    timeout: ?dynamisch?;});
     });
     });
    
    </script>
    
    <?php if(!isset($_POST['save'])) { ?>
    <div id="someform">
    <form method="post" action="">
    <textarea name="sometext" id="t_area" rows="25"></textarea>
    <button class="ui-state-default ui-corner-all" type="submit" id="submit_button" name="save">Ausführen</button>
    </form>
    </div>
    <?php
    }
    ?>
    So, da PHP nach dem Absenden auch Infos von fremden Webseiten (die evt. etwas längere Ladezeiten haben) heraussucht, dauert die Ausgabe einbisschen (je nach Länge der Eingabe ~5-10 Sek.).

    -> Hier würde ich dann gerne (solange PHP die Seite "füllt") eine Art "Bitte warten, Daten werden blablabla..." anzeigen lassen.

    Versucht hab ich das natürlich auch schon selbst und zwar bin ich da auf das jQuery Plugin "BlockUI" gestoßen.

    Da ich jetzt nicht wirklich der JS/AJAX-Gelehrte bin, frage ich mich da, ob das denn überhaupt geht, dass das Plugin den User sozusagen "aussperrt" für die Ladezeit die es benötigt oder ob ich da einen anderen Weg gehen muss.

    Würde mich über hilfreiche Antworten freuen!

    Gruß
     
  2. 29. Mai 2010
    AW: Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

    Wieso fügst du dieses Bild oder den Text den du anzeigen lassen möchtest nicht voher ein, lädst danach die Daten in einen Buffer den du danach anstelle von dem Bild / Text einfügst?
     
  3. 30. Mai 2010
    AW: Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

    Muss man das auf Anhieb verstehn?
     
  4. 31. Mai 2010
    AW: Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

    du kannst dein form an iframe (target) senden.
    bei submit deine lightebox anzeigen und wenn
    iframe die anfrage bearbeitet hat einfach mit parent.window
    deine seite neu laden oder lightbox schließen.

    soweit die theorie.
     
  5. 31. Mai 2010
    AW: Ajax "Loading"-Image solange PHP-Skript ausgeführt wird

    du willst also die seite "sperren" solange der server noch läd?

    das geht recht einfach mit nem transparentem div das du über deine webseite legst. (wie bei lightbox/tinymce)

    live: hier in die adresszeile tippen und mit enter bestätigen

    Code:
    javascript:div=document.createElement('div');div.style.cssText='opacity:0.2;background:#fff;position:fixed;top:0;left:0;width:100%;z-index:1000000;';div.style.height=document.body.offsetHeight+'px';void(0);document.body.appendChild(div);void(0);
    quelltext:
    Code:
    var div = document.createElement('div');
    div.style.cssText='opacity: 0.2;'
     + 'background: #fffff;'
     + 'position: fixed;'
     + 'top: 0px;'
     + 'left: 0px;'
     + 'width: 100%;'
     + 'z-index: 1000000;';
     
    div.style.height = document.body.offsetHeight + 'px';
    document.body.appendChild(div);
     
  6. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.