2010-01-04 6 views
1

Problème: J'ai une page commentaire avec chaque boîte de commentaire ayant un bouton « répondre ». Maintenant, les boutons de réponse ont une liaison jquery live click qui, lorsqu'elle est déclenchée, charge le formulaire de commentaire approprié via ajax. Outre les champs habituels, chaque formulaire contient également une entrée captcha. Une fois le formulaire présente avec succès (ou non), je rafraichir le captcha, comme ceci:formes multiples avec Captcha - Erreur sur Ajax Envoyer

// submit triggered and form serialized 
$.ajax({ 
type: 'POST', 
url: myaction, 
data: serializedForm, 
cache: false, 
success: function(data, status) { 
    //checks errors from server 
    $servererr = $(data).find('.error_list'); 
    if($servererr.length === 0) 
    { 
     //flash success message... 
     //refresh captcha 
     $thisform.find('.captcha_img_refresh').trigger('click.refresh'); 
    } 
    else { 
     //flash the server errors and then refresh captcha   
     $thisform.find('.captcha_img_refresh').trigger('click.refresh'); 
    } 
}); 

Maintenant, j'ai 2 formes de commentaires frais (f1 et f2) ouvert sur la même page (ayant 2 actions différentes, par exemple/post/f1 et post/f2 respectivement). Je soumets f1 et aucune erreur signalée. Ensuite, je vais à la deuxième forme et entrer dans tous les détails valides et il jette l'erreur captcha du serveur (si l'autre déclaration ajax ci-dessus exécute). Spectacles Firebug:

> //for first form 
> POST http://mysite.com/post/f1 302 Found 111ms 
> GET http://mysite.com/post/f1 200 OK 600ms 
> 
> //for 2nd form 
> POST http://mysite.com/post/f2 200 OK 800ms 

Pourquoi cela se produit-il? Tout le reste semble bien (theres aussi aucun problème en soumettant des formulaires avec javascript désactivé).

formulaire HTML:

<form id="comment-form-<unique-number>" class="comment-form-new" action="/post/<separate-action>" method="post" style=""> 
<p>Leave a comment:</p> 
    <ul> 
    <li> 
    <textarea rows="10" cols="71" name="myform[text]" id="myform_text"></textarea></li> 
    <li> 
    <label for="myform_username">Name (required)</label> 
    <input type="text" name="myform[username]" value="Anonymous" id="myform_username" /></li> 
    <li> 
     <label for="myform_email">Email (required)</label> 
     <input type="text" name="myform[email]" value="" id="myform_email" /> 
    </li> 

    <li> 
    <label for="myform_captcha">Please enter code shown below:</label> 
    <input type="text" name="myform[captcha]" id="myform_captcha" /> 
    </li> 
    <li> 
    <img id="captcha_img" src="/mysite/captcha/126263" alt="Captcha Image"> 
    <!-- this refreshes captcha --> 
    <a class="captcha_img_refresh" id="captcha_img_refresh"><img src="/images/reload_original.png" /></a> 
    </li> 
    <input type="hidden" name="myform[comment_id]" value="10" id="myform_comment_id" /> 
    <li> 
    <input type="submit" value="Submit" id="comment-form-submit" /> 
    </li> 
</ul> 

Autres détails: Après chaque forme commentaire charges, je ne liaison normale submit (pas vivre contraignante) sur elle. Les valeurs de chaque formulaire sont en cours de sérialisation et envoyées comme tapées dans les champs que l'on peut confirmer via les journaux de la console. J'utilise la bibliothèque Cryptographp (http://www.captcha.fr/) pour les captchas.

Une solution: Si je rafraîchir toutes les captchas sur toutes les formes sur la page après avoir soumis une forme, certains captchas montrent des images d'erreur qui peut, bien sûr, être fixé par l'utilisateur en cliquant à nouveau sur le bouton de rafraîchissement. Mais je cherche autre chose que cette solution de contournement.

+0

Pouvez-vous ajouter le code HTML qui montre comment vos formulaires sont mis en place? Cela aiderait à dépister le problème. –

Répondre

1

Ok ... je l'ai fait un peu plus de tests et voici ce que je pense qui se passe (je peux me tromper aussi): le lien d'image captcha, ce qui est quelque chose comme: /monsite/captcha/(nombre aléatoire), est probablement généré une fois sur le serveur pour chaque formulaire. Quand je charge f1 et ensuite f2, un lien captcha pour f2 est stocké au backend qui annule fondamentalement le lien captcha de f1. Par conséquent, si je soumets f1 (qui est toujours ouvert), le captcha échoue. Donc je suppose que je pourrais essayer (frontend):

  1. Permettre à une seule forme de réponse à un moment
  2. Cache le lien captcha et de l'utiliser à nouveau pour régénérer l'image lorsque l'utilisateur se concentre sur la forme correspondante
  3. d'utilisation la solution de contournement mentionnée ci-dessus

Existe-t-il une méthode dorsale pour résoudre ce problème?