Using Javascript in functions.php

  • Resolved helena.qurfew

    (@helenaqurfew)


    11 years, 9 months ago

    I just put this code into functions.php to create a new field on the registration form. Works great. The only thing is: I want the field to allow number only input.

    To accomplish this I would like to use the following javascript, which works great:

    <script language="javascript">
function forceNumber(event){
var keyCode = event.keyCode ? event.keyCode : event.charCode;
if((keyCode < 48 || keyCode > 58) && keyCode != 8 && keyCode != 9 && keyCode != 32 && keyCode != 37 && keyCode != 39 && keyCode != 40 && keyCode != 41 && keyCode != 43 && keyCode != 45 && keyCode != 46)
return false;
}
</script>

    which I use in the actual field call thusly:

    <input type="number" name="yearly_income" id="yearly_income" class="input" value="<?php echo esc_attr(stripslashes($yearly_income)); ?>" size="25" onkeypress="return forceNumber(event);" /></label>

    The only thing is I am having a difficult time finding out how to include it. At first I just plugged it in to the very top of the functions.php file – it worked great on the field but did not like it and gave me an error on the registration page “cannot modify header information”.

    After reading a number of tutorials and posts about wp_enqueue I tried to include it in various ways with no luck. I did create a seperate js file “forceNumber.js” and have tried to call it a number of ways without success.

    Could anyone offer clear guidance on how to utilize the function of that javascript with the new registration field as entered in the functions.php file?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter helena.qurfew

    (@helenaqurfew)

    I added this to functions.php

    function forceNumber() {
	wp_enqueue_script( 'force-number',	get_template_directory_uri() . '/js/forceNumber.js', array( 'jquery' )
	);
}
add_action( 'wp_enqueue_scripts', 'forceNumber' );

    This appears to be correct according to protocol, but on the registration page the field still allows letters to be entered, whereas when I called the script by just adding the script to the top of functions.php the script actually worked in that it did not allow numbers into the field, but I received the “Warning – cannot modify header information errors at the top.

    ?

    Thread Starter helena.qurfew

    (@helenaqurfew)

    BTW I’m using the straightforward twenty-twelve theme here.

    Thread Starter helena.qurfew

    (@helenaqurfew)

    Using Firebug I see that what I have implemented is not calling the js into the head. Is there some error in how I am implementing the wp_enqueue?

    Thread Starter helena.qurfew

    (@helenaqurfew)

    Can anyone offer any help here? This seems like it would be a fairly straightforward question but I have been unable to find an answer in the documentation or on here by searching and no one is answering this thread:

    I am simply trying to implement the above javascript into my registration page. Someone had suggested to me to take the HTML script tags out of the js file before saving it as a js file. I did that and it is still not working.

    Here is the implementation in functions.php (on line 156):
    https://pastebin.com/ZtK3Kw2E

    Here is the js file contents:

    function forceNumber(event){
var keyCode = event.keyCode ? event.keyCode : event.charCode;
if((keyCode < 48 || keyCode > 58) && keyCode != 8 && keyCode != 9 && keyCode != 32 && keyCode != 37 && keyCode != 39 && keyCode != 40 && keyCode != 41 && keyCode != 43 && keyCode != 45 && keyCode != 46)
return false;
}

    Here is the page it is implemented on:
    https://jannus.org/wp-login.php?action=register

    Again, it seems as if I followed the directions correctly but the page does not seem to be loading the file.

    Is there anyone that could please offer assistance on this?

    Kindly,
    Helena

    Thread Starter helena.qurfew

    (@helenaqurfew)

    After receiving absolutely no assistance here, I received the answer elsewhere. For others having similar difficulty:

    https://wordpress.stackexchange.com/questions/103456/javascript-on-registration-page/103459?noredirect=1#103459

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Using Javascript in functions.php’ is closed to new replies.