unitet20
Goto Top

Enter Taste TEILWEISE im Formular blockieren?

Moin!
Ich weiß das es im Web unzählige Foren-Beiträge zu dem Thema gibt.
Allerdings habe ich eine wirklich praktikable Lösung dafür noch nicht gesehen...
Zumindest keine die das kann, was ich vorhabe...

Also fange ich mal an...

Das Problem:
Wenn Jemand in einem HTML Formular auf Enter drückt, wird das Formular abgeschickt!

Meine Wunschlösung:
Die Enter Taste nur in MANCHEN Input Feldern blockieren und durch einen Tabulator "ersetzen" ...
Warum nur in Manchen Feldern?

Ganz einfach:
Ich habe für die Firma ein Web- Urlaubsformular programmiert...
Das hat dementsprechend einiges an input und textfeldern...
In den Input-Feldern soll nun die Enter Taste gesperrt werden, damit das Formular nicht versehentlich verschickt wird.
In den Textfeldern soll die Enter Taste alleridngs noch funtkionieren, damit man darin auch einen Zeilenumbruch bewerkstelligen kann.

Die Einzige Lösung die ich bisher gefunden habe und zu Opera, FF und IE kompatibel ist, Blockiert die Enter-Taste allerdings im kompletten Formular.

<script language="JavaScript">  
document.onkeydown = checkKeycode
function checkKeycode(e) {
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
alert("keycode: " + keycode);  
}
</script>

Allerdings bin ich nun nicht so der JS-Held um daraus zu bauen was ich gerne hätte.
Daher brauche ich da ein bisschen Hilfe. face-smile

Meint ihr das kann man irgendwie Lösen?
Oder suche ich hier nach dem Heiligen-Grahl der Formular-Erstellung? ;)

Lieben Gruß und Danke schonmal für eure Antworten!
Unitet20

Content-ID: 106218

Url: https://administrator.de/forum/enter-taste-teilweise-im-formular-blockieren-106218.html

Ausgedruckt am: 23.12.2024 um 07:12 Uhr

Unitet20
Unitet20 16.01.2009 um 11:38:41 Uhr
Goto Top
Okay, ein bisschen weiter bin ich schon...

Formular
<form name="test" action="irgendwas" method="post">  
<input type="text" name="eingabe1" onkeypress="catchKeycode(event.keyCode)"><br>  
<input type="text" name="eingabe2" onkeypress="catchKeycode(event.keyCode)"><br>  
<input type="text" name="eingabe3" onkeypress="catchKeycode(event.keyCode)"><br>  
<input type="text" name="eingabe4" onkeypress="catchKeycode(event.keyCode)"><br>  
<input type="submit" name="submit" value="Senden">  

JS-Funktion
function catchKeycode(k) {
    if(k == 13){
        alert(k);
    }
}

So kann ich aufjedenfall aus allen aktuellen Browserversionen von IE, FF und Opera den keyCode abfragen...

Allerdings weiß ich nun nicht, wie ich es schaffe, das statt der KeyCode =13 die KeyCode = 9 ausgeführt wird...
Kann mir da einer weiterhelfen? ^^ Oder muss ich mich nun erstmal komplett ins Thema JS einlesen? ;)

Lieben Gruß
Uni
Unitet20
Unitet20 20.01.2009 um 15:08:29 Uhr
Goto Top
Okay, habs allein gelöst...
Musste mich zwar erst ein bisschen ins Thema JS einlesen, aber was solls.

Ist warscheinlich nicht die beste Lösung, denn IE meckert wegen "Active X Komponenten" aber in unserem Intranet sind die Sicherheitseinstellungen nicht so hoch und da gibts dann keine Meldung...

Also meine Lösung ist folgende:


Formular:

<form name="test" action="irgendwas" method="post">   
    <input type="text" name="eingabe1" onkeypress="return catchKeycode(form, event.keyCode, 1, 4)"><br>   
    <input type="text" name="eingabe2" onkeypress="return catchKeycode(form, event.keyCode, 2, 4)"><br>   
    <input type="text" name="eingabe3" onkeypress="return catchKeycode(form, event.keyCode, 3, 4)"><br>   
    <input type="text" name="eingabe4" onkeypress="return catchKeycode(form, event.keyCode, 4, 4)"><br>   
    <input type="submit" name="submit" value="Senden">  


JS-Funktion

function catchKeycode(f, eventCode, pos, end){
    if(eventCode == 13){      // Wenn enter gedrückt
        pos = pos+1 // NR des nächsten Input-Felds
        if(pos <= end){
             f.elements['eingabe['+pos+']'].focus(); // Springe zu nächstem Input feld  
        }
        return false; // Event = ENTER nicht ausführen
    }
    else{
        return true; // Jede andere Taste ist OK
    }
}

Ist wie gesagt nur eine Bastellösung die für meine Zwecke reicht...
Aber vielleicht bastelt der ein oder Andere daraus noch was sinnvolleres, oder findet hier die nötigen Infos zu "Weiterverarbeitung" ...

NACHTRAG: Die Funktion habe ich mit Opera 9.6, Firefox 3.0.5 und Internet Explorer 7.0.6001.18000 getestet.

Gruß
Unitet20

-case closed-