Hiding content conditionally using jQuery in SharePoint 2010

Question

I am developing a Blog for SharePoint 2010. I already have everything set up, but now I need to install a Capcha for validation before a user can comment on a post. I have a web part developed for the capcha. I was thinking that I could use the text value of the span id"ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel" (You've got to love sharepoint naming lol) and jQuery to show and hide the comments portion based on if there is a value of success!. Unfortunately, I am having little success getting this to work. Here is my code...

<script type="text/javascript">
    $(document).ready(function(){
     $("#WebPartWPQ7").hide();
     if($("#ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel").text() == success!) {
      $("#WebPartWPQ7").show();
     };
    });
</script>

I am a nube to coding and could use any guidance or suggestions.

Thank you!

Answer 1

<script type="text/javascript">
    $(document).ready(function(){
        var webPart = $("#WebPartWPQ7").hide();
        if($("#ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel").text() == "success!") {
            webPart.show();
        };
    });
</script>

Your "success" it's a variable? Maybe you just missed the quotes.

Answer 2

 if($("#ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel").text() == "success!") {

You missed the double quotes on success! . You also need to attach this to some kind of event, or jQuery will evaluate this code once on document ready and never again. Perhaps like this?

$(document).ready(function(){
 $("#WebPartWPQ7").hide();
 $("#captcha_input").change(function(){
   if($("#ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel").text() == success!) {
    $("#WebPartWPQ7").show();
 });
 };
});

This checks for success every time you change the capcha input.

Answer 3

Rather than hiding your "WebPartWPQ7" element on the document ready, just give it the css style display:none (this will hide the element by default)

Also, you need to have quotes around your success!

<script type="text/javascript">
    $(document).ready(function()
    {
            if($("#ctl00_m_g_c9d562b9_1531_47ac_b0f0_24f06ecea4cc_MessageLabel").text() == "success!")
            {
                    $("#WebPartWPQ7").show();
            };
    });
</script>

Answer 4

Have you tried putting "success!" in quotes?

Usually with Recaptcha you will allow the user to type the comment, fill in the Recaptcha, and then click "Enter" or "Ok". Then the server would check the Recaptcha and either allow the comment or deny it. I don't really understand what you're trying to do.