How to correctly redraw Recaptcha in ASP.NET MVC 2 after AJAX POST

Question

OK...

I downloaded and implemented this Recaptcha implementation for MVC, which uses ModelState to validate captcha control.

It works brilliantly ... unless I start using it in AJAX form.

In a nutshell, when a div is redrawn using AJAX, the ReCaptcha that it should contain does not appear, although the corresponding one <scripts>is in the source after partial rendering.

The code is below.

 using (Ajax.BeginForm("CreateComment", "Blog", 
        new AjaxOptions() { HttpMethod = "POST", 
         UpdateTargetId = "CommentAdd", OnComplete="ReloadRecaptcha", 
         OnSuccess = "ShowComment", OnFailure = "ShowComment", 
         OnBegin = "HideComment" }))
{%>
    <fieldset class="comment">
        <legend>Add New Comment</legend>
        <%= Html.ValidationSummary()%>
        <table class="postdetails">
            <tbody>
                <tr>
                    <td rowspan="3" id="blahCaptcha">
                        <%= Html.CreateRecaptcha("recaptcha", "blackglass") %>
                    </td>
                    .... Remainder of Form Omitted for Brevity

I confirmed that the form is perfectly functional when Recaptcha Control is missing and Javascript calls in AjaxOptionswork fine.

, ModelState Recaptcha - , ActionResult .

    [RecaptchaFilter(IgnoreOnMobile = true)]
    [HttpPost]
    public ActionResult CreateComment(Comment c)
    {
        if (ModelState.IsValid)
        {
            try
            {
                //Code to insert Comment To DB
                return Content("Thank You");
            }
            catch
            {
                ModelState.AddRuleViolations(c.GetRuleViolations());
            }
        }
        else
        {
            ModelState.AddRuleViolations(c.GetRuleViolations());
        }
        return View("CreateComment", c);
   }

InValid , - ReCaptcha Control . <script> <noscript> HTML, HTML Helper , ,

<%= Html.CreateRecaptcha("recaptcha", "blackglass") %>

, - , DOM AJAX, .

HTML, javascript OnComplete= Captcha , script , . OnComplete.

    function ReloadRecaptcha() {
        Recaptcha.create("my-pub-key", 'blahCaptcha', { 
            //blahCaptcha is the ID of the <td> where the ReCaptcha should go.
            theme: 'blackglass'
            });
    }

- ?

, Eoin C

Answer 1

.

Captcha HTML-.

ModelState ..

ReCaptcha AJAX Api http://recaptcha.net/fastcgi/demo/ajax http://api.recaptcha.net/js/recaptcha_ajax.js

, , , , , OnComplete script .

Answer 2

, Html.CreateRecaptcha() <div> -, captcha. Recaptcha.create() 'recaptcha' ( ) 'blahCaptcha' ( td)?

HTML, Html.CreateRecaptcha, , , td.

Answer 3

AJAX . http://www.darksideofthecarton.com/2008/12/15/validating-recaptcha-jquery-ajax/

MVC-, :

http://devlicio.us/blogs/derik_whittaker/archive/2008/12/02/using-recaptcha-with-asp-net-mvc.aspx