أشكال متعددة مع CAPTCHA - خطأ في AJAX

Question

مشكلة: لدي صفحة تعليق مع كل مربع تعليق لها زر "رد". الآن أزرار الرد تحتوي على JQuery Live Click Binding عليها والتي عند تشغيلها يتم تحميل نموذج التعليق المناسب عبر Ajax. إلى جانب الحقول المعتادة، يحتوي كل نموذج على إدخال CAPTCHA أيضا. بعد تقديم النموذج بنجاح (أو غير ذلك)، أحديث كلمة التحقق، مثل ذلك:

// 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');
    }
});

الآن لدي نماذج تعليق جديدة (F1 و F2) مفتوحة على نفس الصفحة (وجود إجراءات مختلفة، ويقول / post / f1 و post / f2 على التوالي). أقدم F1 ولا أخطاء. ثم أذهب إلى النموذج الثاني وأدخل جميع التفاصيل الصحيحة وترمي خطأ CAPTCHA من الخادم (حتى يتم تنفيذ بيان AJAX آخر أعلاه). عروض 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

لماذا يحدث هذا؟ يبدو كل شيء آخر على ما يرام (هناك أيضا عدم وجود مشكلة تقدم النماذج مع إيقاف تشغيل JavaScript).

نموذج 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>

تفاصيل أخرى: بعد تحميل كل تعليق، أقوم بتقديم ملزم طبيعي (وليس ملزما مباشرا) عليه. يتم تسجيل القيم لكل شكل وإرسالها كما كتبت في الحقول التي يمكن للمرء تأكيدها من خلال سجلات وحدة التحكم. أنا أستخدم مكتبة التشفير (http://www.captcha.fr/) ل CAPTCHAS.

حل: إذا قمت بتحديث جميع CAPTCHAS على جميع النماذج الموجودة في الصفحة بعد تقديم أي نموذج واحد، يتم إصلاح بعض الصور التي يمكن تثبيتها من CAPTCHAS، بالطبع، من قبل المستخدم من خلال النقر فوق الزر "تحديث" مرة أخرى. لكنني أبحث عن شيء آخر غير هذا الحل البديل.

Answer 1

حسنا ... لقد قمت ببعض الاختبارات وإليك ما أعتقد أنه يحدث (قد أكون مخطئا أيضا): رابط صورة CAPTCHA، وهو شيء مثل: / mysite / captcha / (عدد عشوائي), ، ربما تم إنشاؤه مرة واحدة على الخادم لكل شكل. عندما أقوم بتحميل F1 ثم F2، يتم تخزين رابط CAPTCHA ل F2 في الخلفية التي لا تتلألأ بشكل أساسي ارتباط CAPTCHA الخاص ب F1. وبالتالي، إذا قمت بتقديم F1 (الذي لا يزال مفتوحا)، فشل CAPTCHA. لذلك أعتقد أنني يمكن أن أحاول (على الواجهة الأمامية):

1. السماح نموذج رد واحد فقط في وقت واحد
2. ذاكرة التخزين المؤقت لربط CAPTCHA واستخدامها مرة أخرى لتجديد الصورة عندما يركز المستخدم على النموذج المقابل
3. استخدم الحل البديل المذكور أعلاه

هل هناك طريقة خلفية لحل هذا؟