ahykes
Erfahrenes Mitglied
Guten Morgen!
Ich habe ein Problem mit meiner Webseite, dass ich mir zwar erklären aber nicht beheben kann :-(
Fangen wir mal an:
Ich hole aus der Datenbank eine Liste, die ich über PHP in Form einer HMTL-Tabelle darstelle. Die Tabelle hat ca. 200 Zeilen. Jede Tabellenzeile sieht so aus:
Ihr ahnt worauf es hinausläuft? Nun soll die Tabelle zyklisch über AJAX aktualisiert werden. Das funktioniert auch einwandfrei. Nun reden wir an dieser Stelle leider vom IE6! Den muss ich leider nehmen.
Endlich kommt das Problem: Jedes Mal, wenn Updater durch die Seite läuft, "hängt" quasi der komplette Browser. Mir scheint, dass ich den Browser damit total überfordere. Habe ich vielleicht die falsche Art und Weise gewählt um die Tabelle zu aktualisieren?
So sieht der Updater aus:
Wo ist die Schwachstelle? Die Daten kommen Komma-Separriert und müssen auseinander genommen werden. Wäre es zum Beispiel schneller wenn ich die Element per nextSibiling statt per getElementById anspreche?
Ich habe ein Problem mit meiner Webseite, dass ich mir zwar erklären aber nicht beheben kann :-(
Fangen wir mal an:
Ich hole aus der Datenbank eine Liste, die ich über PHP in Form einer HMTL-Tabelle darstelle. Die Tabelle hat ca. 200 Zeilen. Jede Tabellenzeile sieht so aus:
HTML:
<tr id="0701801" title="0701801" bgcolor="#aac6f5" >
<td align="center" bgcolor="#FFFFFF" width="15" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);"><a name="0701801.scrollPosition" ><img src="http://www.tutorials.de/images/logo_mb.gif" id="0701801.LOGO" onDblClick="deSelectTableRow();";></a></td>
<td id="0701801.BMIMG" align="center" bgcolor="#FFFFFF" width="30" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);"><img src="http://www.tutorials.de/images/bmImg/A2LL35.jpg" title="A2 / LL / 3.5 to"></td>
<td id="0701801.PNR" align="center" width="48" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);">0701801</td>
<td id="0701801.SAT" align="center" width="48" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);">02.11.10</td>
<td id="0701801.SPERRSTATUS" align="center" width="50" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);"><b></b></td>
<td align="center" align="center"><img src="http://www.tutorials.de/images/edited_state.gif" onClick="expandDistrictionDialog('0701801');" style="cursor: pointer;"></td>
<td id="0701801.EVENT" align="center" width="41" onClick="javascript: addPnr2Hist('0701801','images/logo_mb.gif'); selectTableRow('0701801',false);">FP660</td>
<input type="hidden" id="0701801.LISTE" value="1">
<input type="hidden" id="0701801.SPERRSTATUS_DATA" value="">
<input type="hidden" id="0701801.POS" value="46712">
<script language="Javascript">ksbProducts.push("0701801");</script></tr>Ihr ahnt worauf es hinausläuft? Nun soll die Tabelle zyklisch über AJAX aktualisiert werden. Das funktioniert auch einwandfrei. Nun reden wir an dieser Stelle leider vom IE6! Den muss ich leider nehmen.
Endlich kommt das Problem: Jedes Mal, wenn Updater durch die Seite läuft, "hängt" quasi der komplette Browser. Mir scheint, dass ich den Browser damit total überfordere. Habe ich vielleicht die falsche Art und Weise gewählt um die Tabelle zu aktualisieren?
So sieht der Updater aus:
Code:
function dynamicUpdater(dataStream){
//vars
var rsSeperator = '[+]';
var fieldSeperator = '|';
var ksb = new Array();
//Datenstrom auseinander nehmen
//0686180 | 0686180 | 5 | 99285 | 0 | 22.09.10 | 90665713 | | FP630 | logo_mb.gif | images/bmImg/A4LL50.jpg | A4 / LL / 5.0 to | AR5 BB3 ... [+]
if(dataStream != currentProductsString){
var ksb = dataStream.split(rsSeperator);
ksbOld = currentProductsString.split(rsSeperator);
var opInfo = ksb[0].split(fieldSeperator);
var opMode = opInfo[0];
var opModeStyleSheetClass = opInfo[1];
if(document.getElementById('opMode')){
document.getElementById('opMode').innerHTML = opMode;
document.getElementById('opMode').setAttribute("className", opModeStyleSheetClass,0); ;
}
for(i=1; i<ksb.length; i++){
if(ksb[i] != ksbOld[i] || ksb.length != ksbOld.length){
//alert('Et ändert sisch dennoch watt!');
changes++;
var productfields = ksb[i].split(fieldSeperator);
var pnrLabel = productfields[0];
var pnr = productfields[1];
var LISTE = productfields[2];
var POSITION = productfields[3];
var BANDID = productfields[4];
var SAT = productfields[5];
var BM = productfields[6];
var SPERRSTATUS = productfields[7];
var GUI_FP = productfields[8];
var CODELEISTE = productfields[9];
var CodeView = productfields[10];
var CorporateLogo = productfields[11];
var bmImg = productfields[12];
var bmImgTitle = productfields[13];
var SPERRSTATUSBGCOLORTAG = productfields[14];
var LISTEBGCOLOR = productfields[15];
for(y=0; y<ksbProducts.length; y++ ){
//Gibt es in ksbProducts noch nummern die ich nicht (mehr) in dataStream habe?
if(dataStream.indexOf( ksbProducts[y] ) == -1){
// dannn löschen
//alert('lösche nummer ' + ksbProducts[y]);
document.getElementById('basisDataTableTbody').removeChild(document.getElementById(ksbProducts[y]));
ksbProducts.splice(y,1);
//document.getElementById(ksbProducts[y]).style.display = 'none';
}
}
if(pnr != ''){
listChanged = false;
if(document.getElementById(pnr)){
var elementToMove = document.getElementById(pnr);
var reSelectTableRow = false;
//Listenfeld ändern
//Kopie an gewünschte Stelle (inserationPoint.1) anhängen
if(document.getElementById(pnr + '.LISTE').value != LISTE){
if(pnr == lastHistoryEntry){
deSelectTableRow();
reSelectTableRow = true;
}
document.getElementById(pnr + '.LISTE').value = LISTE;
var inserationPoint = document.getElementById("inserationPoint." + LISTE);
inserationPoint.parentNode.insertBefore(elementToMove, inserationPoint);
listChanged = true;
}
//Listenfarbe ändern
elementToMove.setAttribute("bgcolor", LISTEBGCOLOR, 0);
//FP ändern
fps.updateOnChange(pnr + '.EVENT', GUI_FP);
//Sperrstatus
fps.updateOnChange(pnr + '.SPERRSTATUS' , SPERRSTATUS);
document.getElementById(pnr + '.SPERRSTATUS_DATA').value = SPERRSTATUS;
if(SPERRSTATUS != '') {
document.getElementById(pnr + '.SPERRSTATUS').setAttribute("bgcolor", '#FF0000',0);
document.getElementById(pnr + '.SPERRSTATUS').innerHTML = '<b>' + SPERRSTATUS + '</b>';
}
//POSITION
//fps.updateOnChange(pnr + '.POSITION' , POSITION);
if(reSelectTableRow){
selectTableRow(pnr, true);
}
}else{
//nein:
//neue Zeile anlegen
asyncRequest("classes/getProductData.php?&pnr=" + pnr + "&GROUP_NAME=" + groupName, "createNewProduct");
//alternative
//location.reload();
}
}
if(document.getElementById('productCount')){
document.getElementById('productCount').innerHTML = ksbProducts.length;
}
}
}
currentProductsString = dataStream;
}
}Wo ist die Schwachstelle? Die Daten kommen Komma-Separriert und müssen auseinander genommen werden. Wäre es zum Beispiel schneller wenn ich die Element per nextSibiling statt per getElementById anspreche?
Zuletzt bearbeitet:
