JavaScript Form Help

 

This script will provide a user with some help while filling in a form.

 

If you would like the question mark images to go with the form, simply follow these instructions below:

  • Right-click on the image (CTRL + click for MAC).
  • Select "Save As" and save the GIF image to the appropriate folder on your website.

Please note: This version may not work in IE. 

 

Example

 

Form With Help Option
First Name:
Last Name:

 

Script Source

 

<The JavaScript >

<SCRIPT type="text/javascript">

<!-- Hide script form old browsers

// +++++++++++++++++++++++++++++++++++
// + Script by www.wizzardweb.co.uk
// + Copyright 2016
// + Please DO NOT remove this information
// +++++++++++++++++++++++++++++++++++

function helpInfo(name, output, msg) {

newwin = window.open('','','top=150,left=150,width=325,height=250');

with (newwin.document)

{

open();

write('<html>');

write('<body bgcolor=FFFFFF onLoad="document.form.box.focus()"><form name=myForm>' + msg + '<br>');

write('<p><input type=button value="Close Help" onClick=window.close()>');

write('</center></form></body></html>');

close();

}

}

// End hide -->

</script>

 

<The Form >

<fieldset>
<legend>Form With Help Option</legend>
<form name="myForm" method="post" action="">

First Name: <input type="text" name="FirstName" size="15"> <a href="javascript:helpInfo('First Name', 'opener.document.form.FirstName.value', 'Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!');"><img src="Question-Mark.gif" height="15" width="15" border="0"></a><br>

Last Name: <input type="text" name="LastName" size="15"> <a href="javascript:helpInfo('Last Name', 'opener.document.form.LastName.value', 'Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!Help info here!');"><img src="Question-Mark.gif" height="15" width="15" border="0"></a>
</form>
</fieldset>

 

Please let me know if this script was helpful to you.

[rating]