DanielX: Element in DOM einfügen / bei Ansicht des Elementes JS ausführen

Beitrag lesen

SELF-Forum

Element in DOM einfügen / bei Ansicht des Elementes JS ausführen

DanielX
– Informationen zu den Bewertungsregeln

OK, das habe ich leider schon befürchtet ich versuche es nochmal zu erklären.

Ich habe eine BingMaps Seite wo man wenn man rein clickt, den Netzbetreiber und ähnliches an dieser Position angezeigt bekommt.

Dort gibt es nun auch einen Link neben dem Namen des Netzbetreiber welches einem die Nutzungsentgelte an dieser Stelle anzeigen soll.

Der Link ist mit einer Javascript Funktion versehen welche, zum anzeigen meines Info-PopUp dient.

Wird die Funktion zum anzeigen aufgerufen, stellt sie ein Request mit Parameter wie dem Netzbetreiber an eine aspx-Seite(getNutzungsentgelte.apx).

Die aspx Seite füllt sich nun anhand der übergebenen Parameter mit den Nötigen Daten.

Die Seite ist folgendermaßen aufgebaut, oben eine einzeilige Überschrift, dann ein DIV-Block der 100Pixel groß ist und zur Auswahl verschiedener Tarife/Entgelte dient und als letztes ein iFrame wo der eigentlich Tarif angezeigt wird.

Ein iFrame aus dem Grunde da ich die Tarife als fertige HTML-Seite aus meiner Datenbank bekomme.

Und dieser besagte iFrame soll das PopUp-Div bis unten hin ausfüllen, als brauche ich dort ja JavaScript, da mir keine andere Möglichkeit bekannt ist.

Wenn nun das Response der Anfrage zurück kommt, wird das Response in mein PopUp-Div eingefügt, also der Inhalt von "getNutzungsentgelte.aspx".

Jetzt zum eigentlichen Problem, dem berechnen der Größe des iFrames.

Zuerst habe ich versucht in die getNutzungsentgelte.aspx einen Aufruf an die Javascript Funktion zum Berechnen der Größe zu machen.

Allerdings verliert sich dieser JavaScript-Code beim einfügen in mein PopUp-Div.

Also habe ich nun versucht die Funktion zum setzen der iFrame Größe direkt nach der Funktion zum anzeigen des PopUp's ausführen zu lassen.

Siehe Code:

  
function ShowPopUpTarif(content) {  
  
    SetPopUpForTarife(content);  
    SetiFrameForTarife();  
}  
  
function SetPopUpForTarife(content) { //berechnen der Größe des PopUp-Div  
    var txSuchen = document.getElementById("txSuchenNach");  
    txSuchen.disabled = true;  
  
    var divClose = document.getElementById("divPopUp");  
    var divPopUp = document.getElementById("divPopUp2");  
    var divPopUpContent = document.getElementById("divPopUpContent");  
  
    divClose.style.display = "block";  
  
    divPopUp.style.maxWidth = "";  
    divPopUp.style.height = "";  
    divPopUpContent.innerHTML = content;  
  
    var divMap = document.getElementById("map_canvas");  
    //        for (i = 0; i < divPopUp.childNodes.length; i++) {  
    //            divPopUp.removeChild(i);  
    //        }  
    //        divPopUp.appendChild(document.createTextNode(content));  
  
    var width = divMap.offsetWidth - ((divMap.offsetWidth / 100) * 20);  
    var height = divMap.offsetHeight - ((divMap.offsetHeight / 100) * 20);  
  
    var PopUpOffsetLeft = divMap.offsetLeft + ((divMap.offsetWidth - width) / 2);  
    var PopUpOffsetTop = divMap.offsetTop + ((divMap.offsetHeight - height) / 2);  
  
  
    divPopUp.style.width = width + "px";  
    divPopUp.style.height = height + "px";  
    divPopUp.style.left = PopUpOffsetLeft + "px";  
    divPopUp.style.top = PopUpOffsetTop + "px";  
}  
  
function SetiFrameForTarife() { //berechnen der Größe des iFrames im PopUp-Div  
    var divPopUpContent = document.getElementById("divPopUp2");  
    var divTarifHeader = document.getElementById("TarifHeader");  
    var iFrame = document.getElementById("iframeTarife");  
  
    var iFrameHeight = divPopUpContent.clientHeight - divTarifHeader.clientHeight - 25;  
    //var iFrameHeight = divPopUpContent.style.height - divPopUpContent.style.paddingTop - divPopUpContent.style.paddingBottom - divPopUpContent.style.borderTop - divPopUpContent.style.border.bottom - divTarifHeader.style.height - divTarifHeader.style.marginBottom;  
  
    iFrame.style.height = iFrameHeight + "px";  
}

Allerdings ist hier nun das Problem, das zu dem Zeitpunkt wo die Funktion ausgeführt wird, die Elemente die ich vorher in das PopUp eingefügt habe, noch keinerlei Werte in dem Attribute style besitzen.

Nun benötige ich aber style um die Größe korrekt berechnen zu können, da es ja noch padding und ähnliche Abstände gibt.

Zur Zeit habe ich wie man in der gepostet Funktion sehen kann, leider nur den Weg mit ClientHeight zu rechnen und später die Abstände mit "-25px" ab zu ziehen.

Das funktioniert zwar für jetzt ist aber keine schöne Lösung, daher suche ich hier Rat.

Beitrag melden
–
Informationen zu den Bewertungsregeln