ajax + php

[rey]

hi,
ich habe eine ajax Funktion die getWidget heißt die macht nichts anderes als eine php Datei aufrufen. Und den Inhalt in einen Div schreiben.
Leider habe ich nun das Problem das wenn ich mehr als 1 widget lade das erste überschrieben wird und somit nicht mehr sichtbar ist

function getWidget(DivID,eID)
{
    
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(DivID).innerHTML=xmlhttp.responseText;
    console.log(DivID);
    }
  
  }
  xmlhttp.open("GET","?eID="+eID+"&q=1",true);
 xmlhttp.send();
 }

Ich greife auf diese funktion innerhalb einer while schleife zu

$bla .=
                                    '<div id="Order-'.$row->order.'" class="widget-content-wrapper browserDragItem swappable">
                                    
                                         <div id="s-'.$row->widgeteid.'" class="widget-content widget-'.trim($row->widgetname).'">
                                <script type="text/javascript">
                                    getWidget("s-'.$row->widgeteid.'","'.$row->widgeteid.'");
                                         </script>
                                        </div>
                                </div>';

im Browser wird es so gerendert

									</div> <div id="Order-1" class="widget-content-wrapper browserDragItem swappable">	
										 <div id="s-bahnTicket_eID" class="widget-content widget-Bahn Ticket">
								<script type="text/javascript">
									getWidget("s-bahnTicket_eID","bahnTicket_eID");
										 </script>
										</div>
								</div></div>
									<div id="browserCol-klickTel_eID" class="newBrowserCol droppableBox">
										<div class="widget-bar clearfix">
											<h3 class="widget-title">Auskunft Klicktel</h3>
												<ul class="widget-option-list clearfix">
													<li><a class="widget-drag" href="javascript:void();"
													 title="Widget verschieben">Widget verschieben</a></li>
													<li><a class="widget-switch" href="javascript:void();" 
													title="Widget austauschen">Widget austauschen</a></li>
													<li><a class="widget-maximize" onclick="MaximizeWidget('s-')" 
													title="Widget maximieren">Widget maximieren</a></li>
													<li><a class="widget-delete" onclick="deleteWidget('s-')" 
													title="Widget l&ouml;schen">Widget l&ouml;schen</a></li>
											</ul>
									</div> <div id="Order-2" class="widget-content-wrapper browserDragItem swappable">	
										 <div id="s-klickTel_eID" class="widget-content widget-Auskunft Klicktel">
								<script type="text/javascript">
									getWidget("s-klickTel_eID","klickTel_eID");
										 </script>
										</div>
								</div></div>

So wie ich das sehe werden die nach einander aufgerufen, außerdem bekommen die andere DivIDs.
Deshalb verstehe ich nicht wieso ich nur das Element sehe was zuletzt auf die Funktion zugreift.
Jemand eine Idee?

 

[Sorc]

AW: ajax + php

Hi,
versuche die divs in verschiedenen Zeitabständen zuändern. Ich kenne das Problem auch wenn man sie zur selben Zeit aufruft, das sie sich dann irgendwie überschneiden obwohl sie verschiedene ID's haben. Bin leider auch noch nicht dahinter gekommen wieso das so ist.

 

[exo]

AW: ajax + php

Hmm den Fehler an sich find ich grade auch nicht wirklich, aber versuch mal den Script-Block in deinem PHP-Code außerhalb des Ziel-Div-Containers zu lagern, vielleicht liegts ja daran..

Ach und ich will dir an dieser Stelle sehr gern mal jQuery ans Herz legen...

Den deine Funktion würde mit jQuery ungef. so aussehen

$('.divID').load('deinephpfile.php?paramter');

mehr nicht also würde dir viel Zeit ersparen - mal ganz von den weiteren Funktionen abzusehen.

 

[Sorc]

AW: ajax + php

Ich mache das Thema nochmal publik.
Mich würde es auch mal interessieren warum es nicht so funktioniert.
Also 2 verschiedene div's mit ajax reloaden ohne das sie sich überschneiden muss doch gehen.
Und bitte kein jquery tipp, denn soweit steht mein script schon und ich möchte es nicht neu schreiben mit jquery. Zumal ich auch keine ahnung von jquery habe.

 

[pac_nrw]

AW: ajax + php

Wenn ich das richtig sehe, werden nicht alle div-Elemente geschlossen. Hier kann mir die Kristallkugel aber nicht viel weiterhelfen da der Autor nicht den ganzen Quellcode zur ansicht bereitgestellt hat.
Es kann auch sein das sich der Statuscode bei einem doppelten Aufruf überschreibt. In dem Fall hilft es schon, wenn man einen kleinen timeOut einbaut (100ms sollten reichen)

vg

 

[Sorc]

AW: ajax + php

Ok. Ich habe es zur Zeit so im Script.

function CreateXmlHttpObjet()
{
    var xmlHttp = null;

    try
    {
        // Firefox, Opera 8.0+, Safari
        xmlHttp = new XMLHttpRequest();
    }
    catch( e )
    {
        // Internet Explorer
        try
        {
            xmlHttp = new ActiveXObject( "Msxml2.XMLHTTP" );
        }
        catch( e )
        {
            xmlHttp = new ActiveXObject( "Microsoft.XMLHTTP" );
        }
    }
    return xmlHttp;
}

function refreshTextBox()
{

    xmlHttp = CreateXmlHttpObjet();

    if( xmlHttp == null ) return ;

    xmlHttp.onreadystatechange = function()
    {
        if(xmlHttp.readyState==4 && xmlHttp.status==200)
        {
            document.getElementById( 'textbox' ).innerHTML = xmlHttp.responseText;
        }
    }
        
    xmlHttp.open( 'GET', 'textbox.php', true );
    xmlHttp.send( null );
    
}

function refreshUserBox()
{

    xmlHttp = CreateXmlHttpObjet();

    if( xmlHttp == null ) return ;

    xmlHttp.onreadystatechange = function()
    {
        if(xmlHttp.readyState==4 && xmlHttp.status==200)
        {
            document.getElementById( 'userbox' ).innerHTML = xmlHttp.responseText;
        }
    }
        
    xmlHttp.open( 'GET', 'userbox.php', true );
    xmlHttp.send( null );
    
}

iv = setInterval("refreshTextBox('textbox.php')",5000);
iv = setInterval("refreshUserBox('userbox.php')",12000);

Das Problem ist allerdings das sich die 2 manchmal überlagern. Am meisten taucht das Problem im Opera Browser auf. Gibt es nicht eine Möglichkeit das wenn er gerade ein refresh läuft der andere wartet bis es vorbei ist?

 

[pac_nrw]

AW: ajax + php

Versuch das mal so, indem du den zweiten erst aufrufst, wenn der erste fertig ist:

function refreshUserBox()
{
 xmlHttp = CreateXmlHttpObjet();
 if( xmlHttp == null ) return ;
 xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState==4 && xmlHttp.status==200)
    {
    document.getElementById( 'userbox' ).innerHTML = xmlHttp.responseText;
    }
  }
    xmlHttp.open( 'GET', 'userbox.php', true );
    xmlHttp.send( null );
    iv = refreshTextBox('textbox.php');
}

vg

 

[Sorc]

AW: ajax + php

Habe es hinbekommen. Allerdings muss das

iv = refreshTextBox('textbox.php');

zwischen

if(xmlHttp.readyState==4 && xmlHttp.status==200)
    {
    document.getElementById( 'userbox' ).innerHTML = xmlHttp.responseText;
    }

da er sonst wieder beides gleichzeitig ausführt.

Also so muss es aussehen.

function refreshUserBox()
{
 xmlHttp = CreateXmlHttpObjet();
 if( xmlHttp == null ) return ;
 xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState==4 && xmlHttp.status==200)
    {
    document.getElementById( 'userbox' ).innerHTML = xmlHttp.responseText;
    iv = refreshTextBox('textbox.php');
    }
  }
    xmlHttp.open( 'GET', 'userbox.php', true );
    xmlHttp.send( null );

}