How can I integrate a javascript application into an ASP.NET application?

Question

0.00/5 (No votes)

See more:

Hello! I found an excellent javascript typing test here on Code Project (Advanced Typing Test). I would like to include this in an ASP.NET 2.0 (VB.NET) application that I am developing(I am using Visual Web Developer 2010), but am having trouble in two areas:

The first is a bunch of errors that I get when I paste the javascript into my .aspx page. If I run this from an .html file, it runs perfectly. The errors only show up in the .aspx page. Below are a few error samples when the page runs from a website:

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)Timestamp: Wed, 2 Feb 2011 20:32:47
 
UTCMessage: 'document.JobOp.given' is null or not an object
Line: 492Char: 2 Code: 0Message: Object required
Line: 402Char: 1 Code: 0Message: 'document.JobOp.start' is null or not an object
Line: 154Char: 2 Code: 0Message: 'document.JobOp.start' is null or not an object
Line: 154Char: 2 Code: 0

There were other errors that I was able to fix (minor ones like attributes not enclosed in quotation marks). However, the other issue is how to get the final typing speed back to the .aspx page (postback, perhaps?) so that it can be submitted to a database.

I must admit, I am totally unfamiliar with javascript.... If anyone could help with these issues, I would be entirely grateful.

I would post the javascript for the typing test, but, as it is located elsewhere on the site, I felt that unnecessary.

Thanks, in advance.

Posted 4-Feb-11 4:50am

talamar3

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Steve Wellens · Answer 1 · 2011-02-04T12:11:00

Solution 1

Did you name the form?

Posted 4-Feb-11 12:11pm

Steve Wellens

Comments

talamar3 5-Feb-11 22:57pm

Yeah, I thought of that... However, I already have a form tag in my header (that holds my login) from the master page. Anytime I add the 'runat="server"' I get the message 'A page can have only one server-side Form tag.'

Steve Wellens 5-Feb-11 23:28pm

It doesn't have to have runat="server" to work.
(You can take that property out, think of the form as a named container)

talamar3 5-Feb-11 23:46pm

Here is where the issue happens :
<script>
randNum = Math.floor((Math.random() * 10)) % intToTestCnt;
strToTestType = strToTest[randNum];

document.JobOp.given.value = strToTestType; <------ first error happens here
document.JobOp.typed.focus(); <------ this is the second error
</script>

The form is named "JobOp". The variables are all valid, initialized and not null. For some reason, it does not recognize JobOp as an object.

Steve Wellens 6-Feb-11 9:13am

There must be something else you are not mentioning. This works (with two form elements):

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript">
function Test()
{
document.JobOp.start.value = "New Text!!";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>

<form name="JobOp">
<input type="button" value="My Button" name="start" önclick="beginTest()" />
<input id="Button1" type="button" value="Change the other button" önclick="Test();"/>
</form>
</body>
</html>