The JavaScript Source: Forms : Auto Fill

Browse Doc JS's Tips!

Promotions

Free Announcements

General

Set a text field value in one window by entering text in another window.

(click on "help" to open the new window)

Notes

Created by: Vladimir Geshanov
Posted: April 11, 2005

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: autoFill.js

/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Vladimir Geshanov |  */
function explain( name, output, msg ) {
    newwin = window.open( '', '', 'top=80,left=60,width=350,height=200' );
    if ( !newwin.opener ) newwin.opener = self;
    newwin.opener.document.bgColor = "EBEBEB";
    with ( newwin.document ) {
        open();
        write( '<body onLoad="document.form.box.focus()">' );
        write( '<form name=form ' );
        write( '    onSubmit=opener.document.bgColor="EAE8E4";window.close()>' );
        write( msg );
        write( '<br>' );
        write( '<font face=Verdana size=2>' );
        write( '<p>You may enter your ' + name + ' here ' );
        write( '<p>and it will be copied into the form for you.</p>' );
        write( '<center>' + name + ':' );
        write( '</font>' );
        write( '<input type=text name=box size=10 onKeyUp=' + output + '=this.value>' );
        write( ' ' );
        write( '<input type=submit value="Finish">' );
        write( '</center></form>' );
        close();

    }
}

Head

Paste this code into the HEAD section of your HTML document.


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

Body

Paste this code into the BODY section of your HTML document


<span class=DefMenuText>(click on "help" to open the new window)</span>
<form name=form>
<span class=PreText>Username:</span>
    <input type=text name=username size=10>
    <span class=BodyText>[<a href="javascript:explain(
        'User Name',
        'opener.document.form.username.value',
        '<font face=Verdana size=2>' +
        'The user name field is where you select a user name that ' +
        'you will use every time you access this site.'
    );">help</a>]</span>

<br>
<span class=PreText>Password:</span>
    <input type=text name=password size=10>
    <span class=BodyText>[<a href="javascript:explain(
        'Password',
        'opener.document.form.password.value',
        '<font face=Verdana size=2>' +
        'The password field is where you select a unique password ' +
        'for your account. This password will be required each ' +
        'time you login to the site.'
    );">help</a>]</span>
</form>

User Comments

Add a comment, suggestion, or correction

Comments feed

Do you write JavaScripts?
If you do, why not submit them to us?
We'll give you credit and a link back to your Web site.

Navigation Menu

Internet.commerce

Internet.com

Developer Channel

Great Sites