freies Hilfsfeld beim Tippen andocken, left und top finden

[Linuchs]

Moin,

bei Eingabe von Orten kommen Vorschläge per Ajax zum Anklicken.

Bisher hatte ich das Vorschlags-div HTML-mäßig an das input-Feld geklebt. Nun gibt es aber mehrere input-Felder in einer form und ich möchte die Vorschläge variabel positionieren.

Das Feld parke ich mit position:absolute;display:none erstmal oben links auf der Seite.

Wenn mehr als 2 Zeichen eingegeben werden, holt sich Ajax die Vorschläge vom Server und das „freie“ Vorschlagsfeld soll an das aktuelle input-Feld angedockt werden.

Irgendwie klappt's nicht mit der Positionierung, es erscheint viel zu weit unten auf der Seite.

Ausgehend vom aktuellen input-Feld (obj) hole ich mir left und top auf diese Weise:

/* *******************************************
 * Neues obj, Vorschlagsfeld positionieren
 * ******************************************* */
if ( obj.name != getOrteVar.obj.name ) {
  getOrteVar.obj = obj;        // speichern/merken fuer die UEbername Vorschlagswert
  var left = 5;                                   // 5px rechts vom Feldanfang ansetzen
  var top  = obj.offsetHeight +obj.clientHeight;  // unterhalb des Eingabefeldes ansetzen
  var obj2 = obj.parentElement;
  while ( obj2.tagName != "BODY" && obj2.style.position != "absolute" && obj2.style.position != "relative" ) {
    left  +=  obj2.offsetLeft;
    top   +=  obj2.offsetTop;
    obj2   =  obj2.parentElement;
  }
  getOrteVar.obj_vorschlaege.style.left  = left  +"px";
  getOrteVar.obj_vorschlaege.style.top   = top   +"px";
}

Weil ich nicht sicher bin, ob BODY standardmäßig absolut/relativ positioniert ist, habe ich body {position: relative;} definiert. Das Problem bleibt, auch wenn ich body klein schreibe.

Vielleicht sieht jemand den Haken sofort?

Gruß, Linuchs