I am trying to add help text to a form field. When the user clicks in the field, corresponding help text will be shown just below the field. As i have said before i am newbie when it comes to jquery. The jquery code that i have added to my form is as shown.

$("#username").focus(function() {
  $(".name-help").slideDown(500);
}).blur(function() {
  $(".name-help").slideUp(500);
});

$(".email").focus(function() { $(".email-help").slideDown(500); }).blur(function() { $(".email-help").slideUp(500); });

The problem is i am not sure if that's the correct way of embedding jquery functions in php + html code. This is not working. When i inspect the page i get the following errors

1. $ is not a function agent-register

2. Empty string passed to getElementById()

Can anyone help me to fix this? What i am doing wrong here? Or is there an alternative way to achieve this? Any help will be appreciated. Thank you!

  • Which file are you currently adding your code in? – Lodder Jul 23 '15 at 14:43
  • Do i add the code snippet or something? But you can check out the form here here – Paul Jul 23 '15 at 14:51
up vote 0 down vote accepted
  1. You're using $(".email") but there is only an ID assigned to this input field, not a class, so you need to replace it with $("#email").
  2. You need to wrap you code inside jQuery(document).ready(function($){ ... });

I've altered your code for you:

jQuery(document).ready(function($){

    $('#username').focus(function() {
        $('.name-help').slideDown(500);
    }).blur(function() {
        $('.name-help').slideUp(500);
    });

    $('#email').focus(function() {
        $('.email-help').slideDown(500);
    }).blur(function() {
        $('.email-help').slideUp(500);
    });

});

And also provided you with a live demo:

http://jsfiddle.net/k7jrzxgu/

Hope this helps

  • This has helped! It is now working. The only problem is i am getting numerous jquery errors titled Empty string passed to getElementById() But thank alot – Paul Jul 23 '15 at 15:30
  • getElementById() had nothing to do with the code in your question. This is coming from somewhere else ;) Glad the answer helped though :) – Lodder Jul 23 '15 at 15:31

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.