Reference function inside seperate javascript file on window.load

Question

I have the following function which only allows for numerical characters to be entered in to the textbox. This is located inside common.js along with other global functions.

 function isNumberKey(evt) {
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode != 46 && charCode > 31
        && (charCode < 48 || charCode > 57))
        return false;

    return true;
  }

Now inside another javascript file I have the following code, what I'm trying to achieve is bind the on keypress event of the textbox mobilenumber to the function mentioned above located in the common.js file I have made a reference to that common.js as follows:

/// <reference path="common.js" /> 

window.onload = function () {
      document.getElementById('mobilenumber').keypress = isNumberKey(this.keypress);
};

But the error I receive is

isNumberKey is not defined $('mobilenumber').keypress = isNumberKey(this.keypress);

When I view source to check the naming conventions this is how it is rendered:

<input id="mobilenumber" class="form-control" type="text" value="" placeholder="Your Mobile Number" name="MobileNumber" data-val-maxlength-max="15" data-val-maxlength="Mobile number can not be longer then 15 characters" data-val="true">

I'm not sure where I'm going wrong with this? any help would be appreciated.

Update

Ok so I moved both javascript files into one file called common as shown here:

$(document).ready(function () {

document.getElementById('mobilenumber').keypress = isNumberKey(this.keypress);

function isNumberKey(evt) {

    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {

        return false;

    }
    return true;

}
});

When the page load instead of binding it, it calls it which gives me an error saying evt if undefined which I understand because nothing has been entered, why is it calling it? and how can I just bind it without having to call it?

I'm currently using bundles in MVC, and at the bottom of the page I use @Scripts.Render("~/bundles/NAME") when I view the source I can see both files, common and the profile.js — Code Ratchet
– Code Ratchet, Commented Mar 1, 2015 at 5:10
Try document.getElementById('mobilenumber').keypress = isNumberKey; ; isNumberKey(this.keypress) appear calling isNumeric immediately ? , also this is document at that context — guest271314
– guest271314, Commented Mar 1, 2015 at 5:36
tried that, and I still get the same error evt is undefined var charCode = (evt.which) ? evt.which : evt.keyCode; — Code Ratchet
– Code Ratchet, Commented Mar 1, 2015 at 5:37
Sorry I added brackets to the end of what you suggested i.e isNumberKey(); I removed the brackets and the error went away but when I type in the box it allows me to enter characters and numerical values. it should only allow for numerical characters — Code Ratchet
– Code Ratchet, Commented Mar 1, 2015 at 5:39

guest271314 · Accepted Answer · 2015-03-01 05:47:09Z

1

Try

$("#mobilenumber").on("input", function(e) {
  return $(this).prop("value", function(_, val) {
    return val.replace(/[^\d]/, "").slice(0, 15)
  })
});

$("#mobilenumber").on("input", function(e) {
  return $(this).prop("value", function(_, val) {
    return val.replace(/[^\d]/, "").slice(0, 15)
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="mobilenumber" class="form-control" type="text" value="" placeholder="Your Mobile Number" name="MobileNumber" data-val-maxlength-max="15" data-val-maxlength="Mobile number can not be longer then 15 characters" data-val="true">

answered Mar 1, 2015 at 5:47

guest271314

1

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:50:51Z

0

JavaScript has no import, include, or require. There are other ways for JavaScript to include external JavaScript contents, though...

From: How do I include a JavaScript file in another JavaScript file?

Perhaps try keeping both the function and the attachment of the event handler in one file.

edited May 23, 2017 at 11:50

CommunityBot

11 silver badge

answered Mar 1, 2015 at 5:10

Stephen Rodriguez

1,0371 gold badge12 silver badges22 bronze badges

1 Comment

Code Ratchet Over a year ago

thanks for that, I also done what you suggested i.e put everything in one file but I get an error I've updated the question

Rakesh_Kumar · Accepted Answer · 2015-03-01 05:39:09Z

0

2 Comments

Code Ratchet Over a year ago

Thanks for the fiddle, but its allows me to enter characters, as well as numerical characters

Rakesh_Kumar Over a year ago

@ScottAtkinson I think it works..You want to enter only numeric characters??

Collectives™ on Stack Overflow

Reference function inside seperate javascript file on window.load

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related