JeuWeb - Crée ton jeu par navigateur

Version complète : formulaire et double clique
Vous consultez actuellement la version basse qualité d’un document. Voir la version complète avec le bon formatage.
Pages : 1 2 3
(12-08-2010, 10:31 AM)Sephi-Chan a écrit : [ -> ]La partie Javascript n'est là qu'en bonus, pour être plus agréable pour l'utilisateur en l'empêchant de se confronter à une erreur s'il clique plusieurs fois.
Tu le dis bien, le javascript c'est du bonus... J'essaye de trouver les solutions les plus propres. si JS désactivé, cette solution ne fonctionne pas. Laissons au serveur ce qui doit être gérer par le serveur. et au client, ce qui doit l'être. Pour ma part, le JS n'est là que pour améliorer l'expérience utilisateur.

(12-08-2010, 10:31 AM)Sephi-Chan a écrit : [ -> ]L'authenticity token est un grand classique (implémenté dans tous les frameworks sérieux), mais je ne vois pas ce qu'il a de plus propre/moins bidouille, c'est équivalent (avec un champ caché côté formulaire en plus).
C'est plus propre, dans le sens ou la solution du token prend aussi en charge le cas du refresh, je ne pense pas que ce soit le cas du javascript. Les solutions sont donc non équivalente. CQFD ^^
(12-08-2010, 11:46 AM)garf a écrit : [ -> ]
(12-08-2010, 10:31 AM)Sephi-Chan a écrit : [ -> ]La partie Javascript n'est là qu'en bonus, pour être plus agréable pour l'utilisateur en l'empêchant de se confronter à une erreur s'il clique plusieurs fois.
Tu le dis bien, le javascript c'est du bonus... J'essaye de trouver les solutions les plus propres. si JS désactivé, cette solution ne fonctionne pas. Laissons au serveur ce qui doit être gérer par le serveur. et au client, ce qui doit l'être. Pour ma part, le JS n'est là que pour améliorer l'expérience utilisateur.

(12-08-2010, 10:31 AM)Sephi-Chan a écrit : [ -> ]L'authenticity token est un grand classique (implémenté dans tous les frameworks sérieux), mais je ne vois pas ce qu'il a de plus propre/moins bidouille, c'est équivalent (avec un champ caché côté formulaire en plus).
C'est plus propre, dans le sens ou la solution du token prend aussi en charge le cas du refresh, je ne pense pas que ce soit le cas du javascript. Les solutions sont donc non équivalente. CQFD ^^

Je crois que tu n'as pas lu la solution que je proposais. Je me cite :

(12-08-2010, 07:22 AM)Sephi-Chan a écrit : [ -> ]Côté serveur, tu peux tout simplement créer une variable de session que tu nommeras par exemple last_form_submitted_at qui contient le timestamp du dernier envoi de formulaire, ainsi sur les formulaires critique il est très simple de vérifier l'écart entre le timestamp courant et le timestamp du dernier envoi de formulaire.

Et Javascript est donc bien un bonus d'utilisabilité. Smile


Sephi-Chan
(12-08-2010, 11:52 AM)Sephi-Chan a écrit : [ -> ]Je crois que tu n'as pas lu la solution que je proposais. Je me cite :
J'avais du lire que la première partie de ta réponse. Cependant ton last_form_submitted_at, j'aime pas c'est trop long comme nom de champ ^^
Je l'utiliserai plus pour imposer un délai plutôt que pour empêcher un resoumission de formulaire. ca fait faire plus d'opération.

t1 - t2 > X <=> comparaison des timestamps
T1 != T2 <=> comparaison de token

La comparaison de timestamp permet plus de chose mais elle est plus gourmande en ressources (je pinaille pour rien du tout mais répond "correctement" à la question Big Grin)

(12-08-2010, 11:52 AM)Sephi-Chan a écrit : [ -> ]Et Javascript est donc bien un bonus d'utilisabilité. Smile
:respect: :good:, en gros j'approuve => tu devrais changer le Chan en Sama ou Sensei
voici pour le JS:

function DisabledInput()
{
setTimeout(DisabledInputNow,1);
function DisabledInputNow()
{
tag=document.getElementsByTagName('input')
for(i=0;i<tag.length;i++)
{
if(tag[i].getAttribute('type')=='submit')
{
tag[i].disabled=true;
}
}
}
}

et pour le html:


<form onsubmit="DisabledInput()">
<input type="submit" name="modifier" value="modifier" />
<input type="submit" name="apercu" value="apercu" />
<input type="submit" name="blabla" value="blabla" />
</form>

je vais appliquer ca à tout mes formulaire, pour le jeton ca va me prenre un peu plus de temps...

merci à vous

bon ap'
(12-08-2010, 12:53 PM)garf a écrit : [ -> ]
(12-08-2010, 11:52 AM)Sephi-Chan a écrit : [ -> ]Je crois que tu n'as pas lu la solution que je proposais. Je me cite :
J'avais du lire que la première partie de ta réponse. Cependant ton last_form_submitted_at, j'aime pas c'est trop long comme nom de champ ^^
Je l'utiliserai plus pour imposer un délai plutôt que pour empêcher un resoumission de formulaire. ca fait faire plus d'opération.

t1 - t2 > X <=> comparaison des timestamps
T1 != T2 <=> comparaison de token

La comparaison de timestamp permet plus de chose mais elle est plus gourmande en ressources (je pinaille pour rien du tout mais répond "correctement" à la question Big Grin)

(12-08-2010, 11:52 AM)Sephi-Chan a écrit : [ -> ]Et Javascript est donc bien un bonus d'utilisabilité. Smile
:respect: :good:, en gros j'approuve => tu devrais changer le Chan en Sama ou Sensei

C'est vrai que c'est du pinaillage pure dans le seul but d'avoir le dernier mot… D'autant que ta solution est forcément plus lente que la comparaison d'entiers lus dans le système (la génération du token, son envoi, la comparaison des chaînes, le retour éventuel).

Et puis, la question initiale portait sur la façon d'empêcher les clics multiples de nuire (et le simple disabled en Javascript, le serveur n'est même pas appelé dans 98% des cas).

Cela dit, merci pour la suggestion de nom, mais je préfère conserver l'actuel. Big Grin


(12-08-2010, 01:05 PM)php_addict a écrit : [ -> ]voici pour le JS:

function DisabledInput()
{
setTimeout(DisabledInputNow,1);
function DisabledInputNow()
{
tag=document.getElementsByTagName('input')
for(i=0;i<tag.length;i++)
{
if(tag[i].getAttribute('type')=='submit')
{
tag[i].disabled=true;
}
}
}
}


Je trouve cette fonction inutilement compliquée et je verrais plutôt quelque chose comme :


function disableInputForDuration(elementId, duration){
var element = document.getElementById(elementId);
element.disabled = true;
setTimeout(function(){ element.disabled = false; }, duration);
}

Et ça s'utilise comme ça :

Code :
<form action="" method="post" onsubmit="disableInputForDuration('submit_button', 2000); event.preventDefault();">
  <input type="submit" id="submit_button" />
</form>


Sephi-Chan
(12-08-2010, 02:13 PM)Sephi-Chan a écrit : [ -> ]Je trouve cette fonction inutilement compliquée et je verrais plutôt quelque chose comme :

merci de la suggestion. j'avais essayé avec les id="" mais sans succes...je ne sais par quel mystere la valeur value="" de l'input n'etait pas passée dans les $_POST

de plus j'ai parfois plusieurs input (avec des value="" differentes) et avec le onsubmit sur le <form> cela ne me fait qu'une seule ligne à rajouter dans mon formulaire...

merci pour la suggestion de ton code, je reverrais ca a tête reposée...(une fois la digestion passée...)

a+
Songe à délocaliser la définition d'événements dans ce cas. Par contre je te conseille de passer par un framework Javascript (je pense à jQuery) car l'API d'enregistrement d'événements ne passe pas sous IE.

Avec jQuery (1.4), tu peux faire quelque chose comme ça :


$('form').submit(function(event){
var submitButton = $(this).find('input[type=submit]:first');
submitButton.attr('disabled', 'disabled').delay(1000).removeAttr('disabled');
event.preventDefault();
});

Bien sûr, ici le event.preventDefault(); sert à empêcher que le formulaire ne soit soumis (pour tester).

De toute façon, si tu n'es pas dans le cadre d'une requête Ajax, il suffit de simplement désactiver le bouton (sans timer pour le réactiver) puisqu'on est très rapidement dirigé sur la page d'action du formulaire.


Sephi-Chan
IMPORTANT

sauf erreur de ma part, les token ne peuvent pas empecher un double clic sur un formulaire, je m'expliques:

lors de l'affichage du HTML on obtient un token dans un champs caché et on enregistre le timestamp du token:

<input type="hidden" value="zeruhzepriouvbhoiuzearfzer">

ok...maintenant on double-clic sur le submit (il n'y a pas rafraichissement de la page) . mais lors du traitement du formulaire que ce soit le token ou le timestamp enregistré, ni l'un ni l'autre ne peut etre utile pour determiner si il y a eu double click...car il est impossible de connaitre le delais entre les 2 clics car la page n'a pas été rafraichie...

le token ne peut servir qu' a detecter un rafraichissement de la page ou pour etre certain de la provenance du code html qui genere le formulaire...

j'ai peur de me tromper mais l'histoire du token pour detecter un doubleclic ne me parait pas valable...
En effet, ce n'est pas le rôle du token.
En revanche, le timestamp fonctionne puisque la variable de session est définie par le script de la page d'action. Donc au premier clic, la page d'action est chargée, la variable définie (un microtime est sans doute plus adapté). Au second clic, la page d'action est encore servie et le microtome peut être comparé à celui précédemment stocké.



Sephi-Chan
attends, je teste en live sur le forum

edit : voilà message posté une seule fois, et je n'ai pas eu le message d'erreur anti-flood.

le token sera plus utile en ajax ou tu dois en renvoyer un nouveau avec chaque réponse de requêten nah ?
Pages : 1 2 3