[javascript] Form niet submitten met Enter - Softwareontwikkeling

dinsdag 3 juli 2007 14:24

Acties:

Verwijderd

Topicstarter

In een tool die ik bouw voor een klant wil ik voorkomen dat een formulier wordt gesubmit door middel van de Enter-toets in een text-veld.

In IE6 heb ik dit werkend door middel van

HTML:

1	<body onkeydown="return checkForm(event)">

checkForm() controleert de keyCode van het event en returnt false als dat 13 is in een bepaald text-veld. Het target vang ik netjes op met een script van Quirksmode.

JavaScript:

function checkForm(e){
    var targ;
    if (!e){var e = window.event;}
    if (e.target){targ = e.target;}               // standard
    else if (e.srcElement){targ = e.srcElement;}     // Windows
    if (targ.nodeType == 3){targ = targ.parentNode;} // Safari bug

    if(e.keyCode==13 && targ.id=="mag_niet"){return false;}
    else {return true;}
}

Als ik in regel 8 een alert zet, dan zie ik dat FF die regel gewoon doorloopt. Hij geeft wel een false voor de keyCode, maar hij stopt het submitten van het form niet.

Ik dacht vervolgens dat ik dit op kon lossen door ook nog dit toe te voegen (ook weer met dank aan Quirksmode).

JavaScript:

1 2	e.cancelBubble = true; if (e.stopPropagation) e.stopPropagation();

Maar ook dit werkt niet.

Blijkbaar begrijp ik iets niet helemaal goed. Iemand een tip (of zelfs oplossing $_/-\o_$ )?

dinsdag 3 juli 2007 14:25

Acties:

Alex)

Je moet dat niet op je body zetten maar op je <input>, of op de <form> op de onsubmit:

code:

1	<form onsubmit="return checkForm(event)">

Dacht ik

We are shaping the future

dinsdag 3 juli 2007 14:39

Acties:

Verwijderd

Topicstarter

Op <input> voorkom ik liever, omdat het idee is dat ik meerdere velden in één script op deze manier kan afvangen. Als niets werkt, zal ik dat zeker doen.

Op <form> heb ik al eerder geprobeerd. Het probleem daarmee was, dat het target van een onsubmit op een form altijd het form is.

dinsdag 3 juli 2007 14:44

Acties:

Gonadan

Admin Beeld & Geluid, Harde Waren

In het volgende topic probeerde iemand ook de 'enter' toets af te vangen.
Misschien kan je daar nog wat mee.

[JS] preventDefault() om enter key uit te schakelen.

Look for the signal in your life, not the noise.

Canon R6 | 50 f/1.8 STM | 430EX II
Sigma 85 f/1.4 Art | 100-400 Contemporary
Zeiss Distagon 21 f/2.8

dinsdag 3 juli 2007 15:21

Acties:

Verwijderd

Topicstarter

Ik heb het nu zo opgelost:

JavaScript:

var deKeyCode=0;

function checkForm(e){
    var targ;
    if (!e){var e = window.event;}
    if (e.target){targ = e.target;}               // standard
    else if (e.srcElement){targ = e.srcElement;}     // Windows
    if (targ.nodeType == 3){targ = targ.parentNode;} // Safari bug

    deKeyCode=e.keyCode;
    if(deKeyCode==13 && targ.id=="mag_niet"){
        return false;
    }
    else {
        deKeyCode=0; // anders werkt submit met enter op andere elementen niet
        return true;
    }
}

HTML:

<body onkeydown="return checkForm(event)">
<form name="F10" id="F10" onsubmit="if(deKeyCode==13){return false;}">
<input type="text" name="blaat" id="mag_niet">
<textarea name="blaat2" id="blaat2"></textarea>
<input type="submit" name="blaat3" value="voer in!">

Dit werkt in FF, Safari, Opera (alle Mac) en IE6.

[ Voor 3% gewijzigd door Verwijderd op 03-07-2007 15:24 ]