Web/JavaScript : Suche per Enter bzw. Button starten

[Driri]

Hallo,

ich sitze hier gerade an einer Webentwicklung. Ich habe ein Frameset, in einem der Frames ist eine Page eingebunden mit folgendem Inhalt (Passthru HTML) :

<input name="suchfeld" type="text" size="10"  onkeypress="evalKeyForSubmit(event);">
<input type="button" name="search" value="Suche" onclick="sucheStarten();">

Darüber hinaus habe ich im JS-Header der Page folgendes definiert :

function sucheStarten()
{
var suchStr = document.forms[0].suchfeld.value;
var urlStr1 = "LkCat2IndexSearch/?SearchView&Query=";
var urlStr2 = urlStr1.concat(suchStr);
document.forms[0].suchfeld.value = "";
parent.frames[3].location.href = urlStr2;
}

function evalKeyForSubmit(event)
{
if (event && (event.which == 13 || event.which == 14))
  sucheStarten();
}

Ziel soll es sein, daß ich in dem Eingabefeld einen Suchbegriff eingebe und per Enter/Return oder per Button die Suche starte. Das Suchergebnis wird dann in einem anderen Frame angezeigt.

Über den Button funktioniert das wunderbar, aber wenn ich Enter drücke, bekomme ich nur einen Fehler 400 zurück (Unbekannter Befehl).

Ich habe mal mit Firebug den Debugger mitlaufen lassen, wenn das JavaScript ausgeführt wird. Bei beiden Wegen läuft die Funktion "sucheStarten" wunderbar durch, die Variablen werden korrekt gefüllt und der letzte Befehl (parent.frames[3].location.href = urlStr2;) wird auch ausgeführt.

Nur leider halt mit unterschiedlichem Ergebnis.

Ich bin absolut kein JavaScript-Profi und weiß daher an dieser Stelle nicht weiter. Hab ich was übersehen ? Gibts einen einfacheren Weg, um das zu bewerkstelligen ?

[flaite]

Welcher Browser 
Mit dem IE funktionieren das event so nicht. 
Manchmal helfen so Sachen wie document.forms[0].suchfeld.blur(); im  body der if von evalKeyForSubmit. Man sollte dann aber nach dem wahren Grund suchen.

Kleinigkeit, aber ich würd das oben so schreiben: 

Code

suchStr = document.forms[0].suchfeld.value;
document.forms[0].suchfeld.value = "";
parent.frames[3].location.href = "LkCat2IndexSearch/?SearchView&Query="  + suchStr

[hwenck]

Für mich hat sich folgende Lösung als praktikabel erwiesen.
1. Einfache Suche in einer eingebetteten Ansicht:
- auf der Maske ein Suchfeld und ein $$Return
- im $$Return (berechnet) "[/" + @WebDbName + "/$$ViewTemplate for " + @ViewTitle + "?OpenForm&StartKey=" + StartText + "]"
jedes 'Enter' springt in der 1. sortierten Spalte zur eingegebenen Buchstabenkombination

Die URL lautet:
https://server/db.nsf/$$ViewTemplate for Ansicht?OpenForm&StartKey=meine Suche

2. Eine umfangreiche Suche im Web kann mit Notes Mitteln nur eingeschränkt realisiert werden.
 z.B. Suche nach leerem Feld
Dafür nutze ich Java

[Driri]

Getestet habe ich das im IE 6 und im Firefox 2.0.

Im Firefox sehe ich halt im Debugger, daß das Script eigentlich abgearbeitet wird. D.h. er läuft in die If-Schleife rein und startet auch die Funktion sucheStarten.

Fehlermeldung in der Console oder so habe ich nicht.

Das mit dem blur() probiere ich mal aus. Für mich ist leider der wahre Grund so nicht erkennbar. Dafür reichen meine Web- und insbesondere meine JavaScript-Kenntnisse nicht aus.

[Driri]

@hwenck :

Gerade das will ich ja nicht. Dann müßte ich das Suchfeld ja in ein anderes Frame stecken.


@Axel :

Jetzt wirds lustig. Ich habe das blur() in der If-Schleife mal hinter das sucheStarten() gepackt. Wenn ich im Debugger durchsteppe, sehe ich jetzt, daß das Suchergebnis korrekt angezeigt wird. Sobald allerdings das blur() ausgeführt wird, habe ich im Frame wieder den 400er stehen.

Fehlt da irgendwas ? Muß ich einen Rückgabewert liefern oder so was ?

[flaite]

Return. Gute Idee. Versuch mal

Code

onkeypress="evalKeyForSubmit(event);return false"

in dem onkeypress-handler unten. 
In IE wird der  eventhandler nicht funktionieren. Dafür gibts dieses if-Konstrukt als erste Zeile deiner event-Handler Funktion
evalKeyForSubmit(event):

Code

if(!event && window.event) {
    event = window.event;
  }

[Driri]

JA ! Ich hab es, danke Axel. Das mit dem Return war der Tipp.

Folgendermaßen funktioniert das jetzt :

Die Seite enthält als Passthru-HTML

<input name="suchfeld" type="text" size="10" onkeypress="return evalKeyForSubmit(event);">
<input type="button" name="search" value="Suche" onclick="sucheStarten()">

Im JS-Header sind die beiden Funktionen "sucheStarten" und "evalKeyForSubmit" definiert

function sucheStarten()
{
suchStr = document.forms[0].suchfeld.value;
document.forms[0].suchfeld.value = "";
parent.frames[3].location.href = "LkCat2IndexSearch/?SearchView&Query=" + suchStr;
}

function evalKeyForSubmit(event)
{
if(!event && window.event)
   {
   event = window.event;
   }
if (event.which == 13 || event.which == 14)
// ENTER oder RETURN gedrückt, also Suche starten
   { 
   sucheStarten();
   return false;
   }
else
   { 
   return true;
   }
}

Ich hatte das vorher schonmal mit dem Return im If-Zweig, allerdings hatte ich da die Klammern ({}) für die Aktionen nicht gesetzt und dann ist jedesmal "return false;" ausgeführt worden.

[Driri]

Mist. Natürlich wieder zu früh gefreut. Im Firefox rennt das so wunderbar, aber im IE habe ich immer noch den Error 400.

Ich vermute, ich hab das mit dem zusätzlichen If-Zweig für den IE falsch verstanden. Ich habe mal bei SelfHTML geschaut wegen des Eventhandlers.

Daraufhin habe ich das noch wie folgt angepaßt, was leider auch nicht läuft im IE (im Firefox läufts natürlich weiterhin) :

function evalKeyForSubmit(event)
{
if(!event && window.event)
   {   
   event = window.event;
   }
if (event.which)
   {   
   taste = event.which
   }
   else if (event.keycode)
   {
   taste  = event.keycode
   }
if (taste == 13 || taste == 14)
// ENTER oder RETURN gedrückt, also Suche starten
   { 
   sucheStarten();
   return false;
   }
   else
   { 
   return true;
   }
}

Noch eine Idee ?

[Driri]

Ok, habs jetzt mit ein wenig Google-Suche herausgefunden. Für Firefox 2 und IE 6 (andere Versionen habe ich hier nicht zu Testen) reicht folgender Code aus :

function evalKeyForSubmit(event)
{
   if (event.keyCode == 13 || event.keyCode == 14)
   // ENTER oder RETURN gedrückt, also Suche starten
   { 
   sucheStarten();
   return false;
   }
   else
   { 
   return true;
   }
}