✔ title Attribute auslesen und weitergeben

[messmar]

Guten Morgen,

ich habe jetzt nen weiteren Bug im Code und der lässt sich soweit ich es versucht habe, nicht lösen/beheben.

Ich habe in einem DIV ein Reihe von Checkboxen, die jenachdem wenn sie gecheckt sind, fügen sie dynamisch via AJAX/GET in einem anderen DIV: $('.result'), eine bestimmte Tabelle mit
dem attribute title. Der DIV result ist am Anfang beim Laden der Seite leer und enthält nur
header und footer, die keinen title als attribute haben.

Gleichzeitig wird eine andere Funktion

 getHTML( $('.block-details') );

aufgerufen, die einen weitern dritten DIV (ist am Anfang hidden und danach gebraucht) mit der Tabelle (nur diese gerade eingefügte Tabelle als Block) befüllt.

Ziel: ich will, dass die einzelnen Tabellen in dem DIV: '.result' einzeln anklickbar sind und beim Klicken den
DIV: '.content-block' laden und dessen Inhalt (die angeklickte Tabelle selbst als Block) zeigen.

JavaScript Code von getHTML():

function getHTML(el) {
        var url;
        var $el = el;
        var $temWraper = $('.result').find( 'table[title]' );
 
        $temWraper.each(function(){
                 alert( 'TITLE: ' + $(this).attr('title') );
                 var $this = $(this);
                 $this.click(function(){
                           url = 'htmlCode/' + $('.h2-temp').attr('data-template') + '/' + $this.attr('title') + '.jsp?locale=de'; 
                           $.get(url, function(data) {
                                   $el.next('div').html( data ).css({'margin': '70px 0 20px 60px'}); 
                           });
                 });
        });
  };

HTML Code:

<div class="apple_overlay" id="overlay">
        <a class="close"></a>
        <div class="block-details">
              .............
        </div>
        <div class="content-block"></div>
</div>
<div class="result"></div>

Es funkt. bis jetzt alles gut..

Problem:

Wenn die Seite geladen ist und ich den ERSTEN Checkbox klicke, dann wird zwar die richtige Tabellen in dem DIV: '.result' eingefügt und auch an der richtigen Stelle, aber der DIV: '.content-block' ist leer bzw. die erste URL/title

... $this.attr('title')...

geht beim ersten Click immer verloren, so dass wenn ich den DIV: '.content-block' sichtbar mache, gar nichts sehe.

Beim zweiten und weiteren Klicks (Checkeboxen) ist der DIV: '.content-block' dann aber befüllt mit der richtigen Tabelle bzw. Code.
Aber den ersten den ich geklickt habe bleibt weiterhin ohne Inhalt oder zeigt immmer den Inhalt der letzten klickten.

Ich habe einen Denkfehler in der Funtkion: getHTML(). Aber ich kann es nicht finden.

Ich hoffe, es ist mir gelungen die Problematik klar und verständlich zu beschreiben. Es ist nicht einfach, es genauer weiter zu geben.

Viele Dank und Gruß
Messmar

 

[messmar]

Ich habe gerade was raus gefunden... folgendes:

das sind die zwei Funktionen, die ich für das Ganze mehr oder weniger bei dem Event Handler der Checkboxen (Ektiv/Nein) ausführe:

getHTMLLoaded( 'htmlCode/' + $('.h2-temp').attr('data-template') + '/' + $checkBox.prev().attr('name') + '.jsp?locale=de', $( 'table.' + $checkBox.prev().attr('data-add') ) );
getHTML( $('.block-details') );


function getHTMLLoaded(url, el) {
       $.get(url, function(data) {
              el.after(data);
       });
};

Was ich rausgefunden habe ist: Wenn ich ne alert zwischen den beiden Aufrufe oben einfüge, dann funkt., das Ganze einwandfrei und wenn
ich sie entferne - was eingenilch am Ende sein wird - dann geht's nicht.

Ich denke, dass ist das Bekannt Problem von Ajax Asynchronous Mode.

Danke
Messmar

 

[messmar]

Hallo,

ich bins nochmal.

Ich habe an promise, deferred gedacht, aber es ist gerade gelöst soweit ich getestet habe.

Lösung/Java Script Code:

function getHTMLLoaded(url, el) {
       $.ajax({
               type: "GET",
               url: url,
               dataType: "html",
               success: function(data){
               el.after(data);
               getHTML( $('.block-details') );
       }
});

Verbessserungen ober bessere Vorschläge sind Willkommen.

Danke
Messmar