Inserting Javascript into ASP.Net page

Question

I have the code

<script type="text/javascript">
    function validateLength(objectSource, args) {
        var a = document.getElementById('<%=txtUserName.ClientID%>').value;
        args.IsValid = (a.length >= 5 && a.length <= 10);
    }
</script>

Which I have in my ASP.NET page.

This works fines. Will validate a textbox to make sure it is between a certain length.

However I am trying to tidy up my page's code. So decided to put this little function into a separate javascript file.

<script type="text/javascript" src="Scripts/MyJS.js">
</script>

Page loads fine and then when the validation comes around it fails. I am guessing it cannot access the textbox( txtUserName).

My question is: How can I get this to work?

I get the error message

0x800a138f - Microsoft JScript runtime error: Unable to get value of the property 'value': object is null or undefined

when the javascript fires

<script type="text/javascript" src"Scripts/MyJS.js"> -> <script type="text/javascript" src="Scripts/MyJS.js"> — messerbill
– messerbill, Commented Sep 10, 2015 at 14:57
@messerbill that was me forgetting while typing the code here. In my actual code there is an = — Sam
– Sam, Commented Sep 10, 2015 at 15:00
document.getElementById('<%=txtUserName.ClientID%>') is not found / existent on your page. Have you spelled it correctly? — messerbill
– messerbill, Commented Sep 10, 2015 at 15:05
@messerbill the code works fine when the script is in the page itself. But when loading from a .js file it cannot find it — Sam
– Sam, Commented Sep 10, 2015 at 15:06

user3401335 · Accepted Answer · 2021-11-02 09:35:47Z

4

When you include a javascript file, the part of code

<%=txtUserName.ClientID%>

isn't rendered.

You have to change the javascript function in two ways Fixing the name of the control

<script type="text/javascript">
    function validateLength(objectSource, args) {
        var a = document.getElementById('txtUserName').value;
        args.IsValid = (a.length >= 5 && a.length <= 10);
    }
</script>

or adding a parameter

<script type="text/javascript">
    function validateLength(objectSource, args, nameOfControl) {
        var a = document.getElementById(nameOfControl).value;
        args.IsValid = (a.length >= 5 && a.length <= 10);
    }
</script>

then you can call the function from your page and the parameter nameOfControl could be

<%=txtUserName.ClientID%>

for example

validateLength(objectSource, args, <%=txtUserName.ClientID%>)

edited Nov 2, 2021 at 9:35

answered Sep 10, 2015 at 15:08

user3401335

2,4152 gold badges23 silver badges37 bronze badges

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

1 Comment

Sam Over a year ago

Adding the element name worked great. Thank you. I knew it would be something simple.

user887675 · Accepted Answer · 2015-09-10 15:07:38Z

2

The <%=txtUserName.ClientID%> runs in context of your page. That will not work in a separate .js file. Separate .js files won't run any asp.net code. You could do something like:

JS file:

function validateLength(objectSource, args) {
    var a = document.getElementById(window.myValidatorId).value;
    args.IsValid = (a.length >= 5 && a.length <= 10);
}

ASP

<script type="text/javascript">
    window.myValidatorId = '<%=txtUserName.ClientID%>';
</script>

Or perhaps read the id from a hidden input field on the page.

answered Sep 10, 2015 at 15:07

user887675

5572 silver badges6 bronze badges

1 Comment

messerbill Over a year ago

but saving data in the browser is not beautiful, i would send it as a param via a normal function

Collectives™ on Stack Overflow

Inserting Javascript into ASP.Net page

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related