Javascript: set an onChange function by javascript, not embedded.

3 New Member

I have an HTML file that includes a JavaScript. I would like this JavaScript to be able to create an "onChange=<function>" attribute against the password element.

Here is an example page of the onChange embedded in the "password" field. This is normal HTML and it works fine.

Expand|Select|Wrap|Line Numbers

 <HTML>

<HEAD><TITLE> Example of onChange Event Handler </TITLE>
 
</HEAD>

<BODY BGCOLOR="FFFFFF" TEXT="000000">

<H3>Example of onChange Event Handler</H3>

<form method="post">

    Name: <input type="text" name="name" size=10><br>

    Pass: <input type="password" name="password" size=10 onChange='alert("It WORKED!")'><br>

<input type="submit" name="submit" size=10 >

</form>

<P>

</BODY>

</HTML>

However, I would like to be able to add the "onChange" method by JavaScript. This way I can dynamically change the method being used. Here is my attempt at getting it to work. This does not work but shows what I am trying to do.

Expand|Select|Wrap|Line Numbers

 <HTML>

<HEAD><TITLE> Example of onChange Event Handler </TITLE>
 
<SCRIPT LANGUAGE="JavaScript">

document.forms[0].elements[1].onChange='alert("It WORKED!")';

</SCRIPT>
 
</HEAD>

<BODY BGCOLOR="FFFFFF" TEXT="000000">

<H3>Example of onChange Event Handler</H3>

<form method="post">

    Name: <input type="text" name="name" size=10><br>

    Pass: <input type="password" name="password" size=10 ><br>

<input type="submit" name="submit" size=10 >

</form>

<P>

</BODY>

</HTML>

Jun 6 '07 #1

Subscribe Reply

47943

r035198x

13,262

MVP

I have an HTML file that includes a JavaScript. I would like this JavaScript to be able to create an "onChange=<function>" attribute against the password element.

Here is an example page of the onChange embedded in the "password" field. This is normal HTML and it works fine.

Expand|Select|Wrap|Line Numbers

<HTML>

<HEAD><TITLE> Example of onChange Event Handler </TITLE>

</HEAD>

<BODY BGCOLOR="FFFFFF" TEXT="000000">

<H3>Example of onChange Event Handler</H3>

<form method="post">

    Name: <input type="text" name="name" size=10><br>

    Pass: <input type="password" name="password" size=10 onChange='alert("It WORKED!")'><br>

<input type="submit" name="submit" size=10 >

</form>

<P>

</BODY>

</HTML>

However, I would like to be able to add the "onChange" method by JavaScript. This way I can dynamically change the method being used. Here is my attempt at getting it to work. This does not work but shows what I am trying to do.

Expand|Select|Wrap|Line Numbers

<HTML>

<HEAD><TITLE> Example of onChange Event Handler </TITLE>

<SCRIPT LANGUAGE="JavaScript">

document.forms[0].elements[1].onChange='alert("It WORKED!")';

</SCRIPT>

</HEAD>

<BODY BGCOLOR="FFFFFF" TEXT="000000">

<H3>Example of onChange Event Handler</H3>

<form method="post">

    Name: <input type="text" name="name" size=10><br>

    Pass: <input type="password" name="password" size=10 ><br>

<input type="submit" name="submit" size=10 >

</form>

<P>

</BODY>

</HTML>

Put the code in a function and call that function onChange of the password box.

Jun 6 '07 #2

dmjpro

2,476

Top Contributor

Welcome to TSDN.

Expand|Select|Wrap|Line Numbers

 
<SCRIPT LANGUAGE="JavaScript">

//document.forms[0].elements[1].onChange='alert("It WORKED!")';

//Here the function reference requires not the string.

//Edit the line like this .....

document.forms[0].elements[1].onChange=function(){alert("It WORKED!")};

</SCRIPT>

Now see the effect.
Have a good day.

Kind regards,
Dmjpro.

Jun 6 '07 #3

auslandt

New Member

Welcome to TSDN.

Expand|Select|Wrap|Line Numbers

<SCRIPT LANGUAGE="JavaScript">

//document.forms[0].elements[1].onChange='alert("It WORKED!")';

//Here the function reference requires not the string.

//Edit the line like this .....

document.forms[0].elements[1].onChange=function(){alert("It WORKED!")};

</SCRIPT>

Now see the effect.
Have a good day.

Kind regards,
Dmjpro.

Thanks for the reply. However, this does not work either.

Jun 6 '07 #4

auslandt

New Member

Thanks for the reply. However, this does not work either.

I found the problem. Your example DOES work, but not if the <SCRIPT> is in the <HEAD>. I believe what happens is that this function is loaded prior to the elements existing.

I moved this snippet to the BOTTOM of the file; after the </HTML> and it worked. Likely because the elements finally do exist so the onChange assignment acutally gets set.

Thanks!

- Matt

Jun 6 '07 #5

by: Stephen Poley | last post by:

I have quite often (as have probably many of you) come across HTML forms with irritating bits of Javascript attached. The last straw on this particular camel's back was a large form I was asked to...

Javascript

javascript onChange event does not work in IE

by: rick | last post by:

The following basic script works fine in firefox by not in IE. Can anyone spot the problem? In IE I can only delete the first line but not the lines created by javascript. Also, look at the HTML...

Javascript

javascript equivalent of 'data dumper'

by: horos | last post by:

hey all, I'm a heavy perl user, not so much a java script user, and was wondering... perl has an extremely nice utility called Data::Dumper, which allows you to dump out the contents of an...

Javascript

Javascript Question

by: beguigne | last post by:

Below is a snippet of a crude date picking routine for a form. I am a novice at this so, I am hitting my head at why when I select the day, the onChange event gives me a blank. What am I missing?...

Javascript

Accessing Embedded Javascript

by: roger31 | last post by:

Hello - i have created a simple composite control with drop down list displaying the US States. I have also a Javascript (County.js) file embedded inside the control. The Javascript file has an...

ASP.NET

calling a javascript alert from php

by: monomaniac21 | last post by:

hi i want to be able to trigger a javascript style popup alert in php (i want a message displayed on the actual page) is this possible?

PHP

Javascript Floating Point Precision Problem

by: rocknbil | last post by:

Hello everyone! I'm new here but have been programming for the web in various languages for 15 years or so. I'm certainly no "expert" but can keep myself out of trouble (or in it?) most of the time....

Javascript

using javascript function in php function??

by: mantrid | last post by:

Can anyone see why the checkbox in the code below doesnt get ticked when the textbox is changed ***This javascript function is called in the textbox's onchange event to check it when it is...

PHP

Javascript onchange problem

by: James007 | last post by:

Hi everyone, I am developing a web page for an embedded application. I created a text box for entering a value (only 1 byte long). The onchange event triggers correctly when I enter the value...

Javascript

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

C# / C Sharp

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The...

Networking - Hardware / Configuration

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...

C# / C Sharp

Javascript: set an onChange function by javascript, not embedded.

Similar topics