Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage JavaScript Touche entrée BIS

Touche entrée BIS

23 réponses
Avatar
LeBuss
Bonjour,

suite à un prmier POST, je compléte ma question.
Ci dessous le bout de code JS qui en théorie :
1) active le bouton "bp_chercher" si j'ai au moins 3 caracteres (ça
fonctionne bien)
2) doit me faire un submit du formulaire si j'appuie sur la touche
Entrée du clavier (OK sous Firefox et Safari mais PAS SOUS IE)

Ma question est comment avoir le même comportement sous les 3 navigateurs ??
Merci
Christophe



<SCRIPT LANGUAGE="JavaScript">
function valid(entree) // Mise en service du bouton chercher si au
moins 3 caractères ont été saisis
{
if(entree.length <= 2)
{
document.forms[0].bp_cherche.disabled = true;
var touche = window.event ? entree.keyCode : entree.which;
if (touche==13) return;
}
else
{
document.forms[0].bp_cherche.disabled = false;
}
}
//------------------------------------------------------------------------------------------
</SCRIPT>


.
.
.
.

<input name="c_critere" type="text" id="c_critere"
onKeyUp="valid(this.value)" />
<input name="bp_cherche" type="submit" id="bp_cherche" value="Chercher" />
Signaler un problème avec ce contenu

10 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
1 2 3
Avatar
SAM
Le 3/31/10 6:51 PM, LeBuss a écrit :
OUI ici : http://bg-distribution.fr/consult.php

saisie d'une ref et validation par enter : ok sous FF,Safari,opéra et
chrome mais pas sous IE



Bon ... Ben ... presque rien à afficher et 22 erreurs ...
Les Fx, Safari et Opera sont bien braves de les accepter.

M'enfin ... voici qui fonctionne chez moi :
<http://cjoint.com/?ebrumtheq5>
IE.6 et brouteurs normaux


Si je puis m'essprimer .... ce truc de recherche est nul ...
il ne trouve pas "BOULON 60 KG 18X40 B"
si je tape "boul"
mais le trouve (parmi 624 refs) si je tape "123"

J'ai pas trouvé le train arrière pour ma 206SW
ça va pas du tout !

--
sm
Avatar
LeBuss
On m'a demandé une recherche sur des codes pas sur des désignations.

Le 01/04/2010 17:43, SAM a écrit :
Le 3/31/10 6:51 PM, LeBuss a écrit :
OUI ici : http://bg-distribution.fr/consult.php

saisie d'une ref et validation par enter : ok sous FF,Safari,opéra et
chrome mais pas sous IE



Bon ... Ben ... presque rien à afficher et 22 erreurs ...
Les Fx, Safari et Opera sont bien braves de les accepter.

M'enfin ... voici qui fonctionne chez moi :
<http://cjoint.com/?ebrumtheq5>
IE.6 et brouteurs normaux


Si je puis m'essprimer .... ce truc de recherche est nul ...
il ne trouve pas "BOULON 60 KG 18X40 B"
si je tape "boul"
mais le trouve (parmi 624 refs) si je tape "123"

J'ai pas trouvé le train arrière pour ma 206SW
ça va pas du tout !

Avatar
SAM
Le 4/1/10 10:45 PM, LeBuss a écrit :
On m'a demandé une recherche sur des codes pas sur des désignations.



;-)

et le JS ? ça fonctionne ?

--
sm
Avatar
LeBuss
Le 02/04/2010 00:17, SAM a écrit :
Le 4/1/10 10:45 PM, LeBuss a écrit :
On m'a demandé une recherche sur des codes pas sur des désignations.



;-)

et le JS ? ça fonctionne ?



NON mais vais voir ça avec JQUERY

En tous cas merci à tous
Avatar
Bol
et le JS ? ça fonctionne ?



NON mais vais voir ça avec JQUERY



Pas besoin, regarde/cherche deja pourquoi sur ta
page le formulaire est validé avec la touche entrée
alors que le bouton submit est disabled.

Essaye plusieurs versions consult1.php consult2.php etc...
- sans JS
- avec input type submit disabled en dur
- etc...

Si tu ne mets pas en ligne on ne pourra rien dire

Le code donné dans les precedents posts fonctionne
mais il y a un truc bizarre sur ta page que je n'arrive pas
à reproduire chez moi

A+
Bol
Avatar
Laurent vilday
LeBuss :
SAM :
LeBuss :
On m'a demandé une recherche sur des codes pas sur des désignations.







IMO c'est une erreur, les deux (voir plus selon les caractéristiques
disponibles) devraient être pris en compte. La preuve a été faite par
SAM il n'a pas utilisé la zone de recherche comme prévu.

M'enfin, c'est pas le sujet, passons.

et le JS ? ça fonctionne ?



NON mais vais voir ça avec JQUERY



OMG. Ca va pas non ? Tu viens avec un "problème" IE et tu espères le
régler avec jQuery ? Ah ah ah, merci pour la partie de rigolade :)

Bon trêve de plaisanteries, alors je vais faire mon râleur comme souvent
avec une petite liste non exhaustive de ce qu'il y a à l'url fournie
quelques posts plus tôt. Mais c'est pour la bonne cause.

Donc, soit l'url de démo à <http://bg-distribution.fr/consult.php>
Avec le code suivant, annoté par quelques commentaires sur des erreurs
basiques qu'on retrouve partout sur le web (et qui m'éneeeeeerve) :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<!--
(1) le XHTML est mort, oublie le. D'autant que tu le fournis
en text/html, ce qui invalide sa raison d'être.
XHTML vs HTML c'est HTML qui a gagné par abandon de l'adversaire
-->

<title>Consultation Stocks</title>
<link href="bg.css" rel="stylesheet" type="text/css" />
<SCRIPT LANGUAGE="JavaScript">

<!--
(2) <script type="text/javascript">
(3) Arrêtes de mixer majuscules/minuscules dans ton code, si
tu étais en vrai XHTML et pas en tag-soup tu verrais à
quel point c'est important. Retourne au HTML4
en attendant le 5.
-->

//------------------------------------------------------------------------------------------
// Mise hors fonction du bouton chercher au premier affichage
// et donne le focus au champ de recherche
function init()
{
document.forms[0].bp_cherche.disabled = true;
document.forms[0].c_critere.focus();
}

/*****************************
(4) Ton formulaire est nommé et possède même un id (ici inutile IMO),
donc il est plus "safe" d'utiliser son index nommé alphanumériquement
plutôt que sa "position" exclusivement numérique depuis la collection de
formulaires du document:

document.forms.form1 ou document.forms['form1']

(5) N'utilises pas les raccourcis pas très ... hummm. Utilises plutôt la
collection "elements" de ton formulaire

function init()
{
var frm = document.forms.form1;
frm.elements.bp_cherche.disabled = true;
frm.c_critere.focus();
}
*****************************/

// Mise en service du bouton chercher
// si au moins 3 caractères ont été saisis
function valid(entree)
{
if ( entree.length <= 2 )
{
document.forms[0].bp_cherche.disabled = true;
}
else
{
document.forms[0].bp_cherche.disabled = false;
}
}

/*****************************
(6) mmmmmmOKay, mais j'aurais plutôt évité les répétitions avec :
function valid(input)
{
input.form.elements.bp_cherche.disabled = input.value.length <= 2;
}

avec un HTML légèrement modifié :
onkeyup="valid(this)"
au lieu de onKeyUp="valid(this.value)"
*****************************/

//------------------------------------------------------------------------------------------
</SCRIPT>

<!--
(7) Tiens ça s'arrête la ? Où il est mon check onsubmit du formulaire ?
Le "problème" c'est que IE (contrairement à Firefox par exemple) fera le
submit du formulaire même lorsque le <input type="submit"> est "disabled".

Exemple pour s'en convaincre :

<form onsubmit="alert('submitted'); return false">
<input type="text" name="txt">
<input type="submit" disabled="disabled">
</form>

Mets le focus dans le <input type="text"> et press ENTER.
Avec IE il alert('submitted') tandis que FF ne fait rien.
Moralité il faut gérer le onsubmit.

<form ... onsubmit="return check(this)">

...
function check(frm)
{
var input = frm.elements.bp_cherche;
if ( input.value.length <= 2 )
{
alert('Au moins 3 caractères requis');
input.focus();
return false;
}
return true;
}
-->

</head>

<body onload="init();">
<table width="1024" border="0" align="center" class="cadre">

<!--
(8) BOUUHOOU. T'as essayé a une résolution moindre que 1024 ? C'est
vraiment pas propre. Qu'est ce que ça me fait mal de voir en 2010 du
code pareil encore en utilisation... :(
-->

...
cut du HTML se faisant passer pour du XHTML invalide avec une mise en
forme par <TABLE> ... :(
...

<form id="form1" name="form1" method="post" action="">

<!--
(9) action="" ??? Sérieusement ?
Tu peux pas mettre action="/consult.php" ?
-->

Entrez au moins 3 caract&egrave;res
<label>
<input name="c_critere" type="text" class="fond_cherche"
id="c_critere" onKeyUp="valid(this.value)" />
</label>

<!--
(10) Yurk ! Quelle horreur. Pourquoi le label ("Entrez au moins 3
caract&egrave;res") n'est pas dans un <label></label> tandis que son
<input> associé est dans un <label></label> ?

Ce serait pas plutôt ceci :

<label for="c_critere">Entrez au moins 3 caract&egrave;res</label>
<input type="text" name="c_critere" id="c_critere"
onkeyup="valid(this)">
-->

<label>&nbsp;
<input name="bp_cherche" type="submit" id="bp_cherche"
value="Chercher" />
</label>

<!--
(11) Yurk bis repetita !
Pourquoi un &nbsp; ? Pour l'espace ? Autant utiliser de la CSS.
Et pourquoi avoir un <label> qui ne sert à rien ?
Vire les tags inutiles :

<input type="submit" name="bp_cherche" id="bp_cherche"
value="Chercher">

-->

...
</form>
...

Donc pour répondre au problème. C'est normal, les IE soumettent les
formulaires même quand leurs <input type="submit"> sont "disabled".
Il *faut* gérer le onsubmit côté client. Et il faut gérer les requis
coté serveur aussi. Ce qui n'est pas le cas actuellement, il suffit de
désactiver le javascript pour pouvoir faire des recherches à 1 caractère.

--
laurent
Avatar
Laurent vilday
Bol :
et le JS ? ça fonctionne ?



NON mais vais voir ça avec JQUERY



Pas besoin



Tu m'étonnes, jQuery pour à peine dix lignes de javascript ultra
basique, c'est un peu beaucoup :)

, regarde/cherche deja pourquoi sur ta
page le formulaire est validé avec la touche entrée
alors que le bouton submit est disabled.



Easy ! Parce que IE (au moins de 6 à 8, et même IE9 preview
1.9.7745.6019) submit les formulaires avec un <input type="submit">
*même* quand il est "disabled".

La preuve :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

</head>
<body>
<form onsubmit="alert('submitted'); return false" action="#">
<input type="text" name="txt">
<input type="submit" disabled="disabled">
</form>
</body>
</html>

--
laurent
Avatar
Laurent vilday
Laurent vilday :

GRRRR, j'ai beau lire et relire avant d'appuyer sur 'Send' et pourtant
je trouve toujours des bêtises après. Ca m'ènerve ...

(5) N'utilises pas les raccourcis pas très ... hummm. Utilises plutôt la
collection "elements" de ton formulaire

function init()
{
var frm = document.forms.form1;
frm.elements.bp_cherche.disabled = true;
frm.c_critere.focus();
}



Il fallait évidemment lire :

function init()
{
var frm = document.forms.form1;
frm.elements.bp_cherche.disabled = true;
frm.elements.c_critere.focus();
}

--
laurent
Avatar
LeBuss
Laurent merci pour tous tes précieux conseils. Mais on ne s'improvise
pas développeur !! Alors j'essaie tant bien que mal à faire un peu de prog.



Le 02/04/2010 13:53, Laurent vilday a écrit :
Laurent vilday :

GRRRR, j'ai beau lire et relire avant d'appuyer sur 'Send' et pourtant
je trouve toujours des bêtises après. Ca m'ènerve ...

(5) N'utilises pas les raccourcis pas très ... hummm. Utilises plutôt la
collection "elements" de ton formulaire

function init()
{
var frm = document.forms.form1;
frm.elements.bp_cherche.disabled = true;
frm.c_critere.focus();
}



Il fallait évidemment lire :

function init()
{
var frm = document.forms.form1;
frm.elements.bp_cherche.disabled = true;
frm.elements.c_critere.focus();
}

Avatar
SAM
Le 4/2/10 1:42 PM, Laurent vilday a écrit :
LeBuss :
SAM :
LeBuss :
On m'a demandé une recherche sur des codes pas sur des désignations.







IMO c'est une erreur, les deux (voir plus selon les caractéristiques
disponibles) devraient être pris en compte. La preuve a été faite par
SAM il n'a pas utilisé la zone de recherche comme prévu.



et puis .. même ... il suffit de taper 256
pour avoir tous les articles où 256 figure n'importe où dans l'intitulé
du code article
et bien sûr ne sont pas proposés d'abord ceux qui commencent par 256

Mébon ... il parait que ce n'est pas le propos ;-)

M'enfin, c'est pas le sujet, passons.



Ha! zutre ! tu l'avais dit.

et le JS ? ça fonctionne ?



NON mais vais voir ça avec JQUERY





d'autant que chez moi mon JS corrigé fonctionne
est-ce que LeBuss l'a essayé ?
pourtant pas compliqué à tester, c'est en ligne chez cJoint ...

Bon trêve de plaisanteries, alors je vais faire mon râleur comme souvent
avec une petite liste non exhaustive de ce qu'il y a à l'url fournie
quelques posts plus tôt. Mais c'est pour la bonne cause.



Aille Ayeayeaille ! ça va faire mal !
(j'avais vaguement évoqué le pb et corrigé bp de choses dans mon corrigé)

Donc, soit l'url de démo à <http://bg-distribution.fr/consult.php>
Avec le code suivant, annoté par quelques commentaires sur des erreurs
basiques qu'on retrouve partout sur le web (et qui m'éneeeeeerve) :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<!--
(1) le XHTML est mort, oublie le. D'autant que tu le fournis



sans être forcément mort, il vaut mieux ne pas l'utiliser car il ne
supporte aucune fantaisie ou erreur quel qu'elle soit

en text/html, ce qui invalide sa raison d'être.
XHTML vs HTML c'est HTML qui a gagné par abandon de l'adversaire
-->


(...)
Exemple pour s'en convaincre :

<form onsubmit="alert('submitted'); return false">
<input type="text" name="txt">
<input type="submit" disabled="disabled">
</form>

Mets le focus dans le <input type="text"> et press ENTER.
Avec IE il alert('submitted') tandis que FF ne fait rien.
Moralité il faut gérer le onsubmit.



ou bien qu'à l'appui sur la touche ça renvoie false à l'event
(si touche de keyCode 13)

<!--
(8) BOUUHOOU. T'as essayé a une résolution moindre que 1024 ? C'est
vraiment pas propre. Qu'est ce que ça me fait mal de voir en 2010 du
code pareil encore en utilisation... :(
-->



y s'en fout c'est à destination de succursales d'achat-vente qui
consultent plein pot sur des 19"
Voyons !

(à part ces comptoirs ou des habitués je ne vois pas qui peut se servir
de ce site où les articles sont "mâchoire de frein" d'on ne sait quoi
... scooter ou bull ?)

bon ... ça doit être encore à l'état de maquette ?
autant en profiter pour refaire le html comme il faudrait.

--
sm
1 2 3