Solved

Cannot get form field to clear when clicked

Posted on 2007-11-29
9
242 Views
Last Modified: 2009-12-06
I have a phplist subscribe form in the top right of this site:

http://www.mokitaproductions.org/index.php?page=home

I'm trying to make the text "enter your email" disappear when the form field is clicked. This should be relatively straightforward, but I can't get it to work.

The javascript I'm using is at:

http://www.mokitaproductions.org/list/clearformfield.js

The form code is attached below.

<form method="post" action="http://www.mokitaproductions.org/list/?p=subscribe" name="signup" target="windowName" onsubmit="window.open('', this.target,
	'dialog,modal,scrollbars=no,resizable=no,width=500,height=250,left=0,top=0');">
	<table border="0">
		<tbody>
			<tr>
				<td class="email-box">
				<div align="center">
				<input name="email" id="email" value="enter your email" size="20" onfocus="clearField(this)" type="text" />
				<script language="Javascript" type="text/javascript">
				addFieldToCheck("email","Email");</script>
				</div>
				</td>
				<td class="attributeinput"> </td>
				<td class="submit"><input class="formInputButton" name="subscribe" value="join mailing list" onclick="return checkform();" type="submit" /></td>
			</tr>
			<input name="htmlemail" value="1" type="hidden" />
		</tbody>
	</table>
	<input name="list[2]" value="signup" type="hidden" /><input name="listname[2]" value="Mokita" type="hidden" />
	<div style="display: none">
	<input name="VerificationCodeX" size="20" type="text" />
	</div>
</form>

Open in new window

0
Comment
Question by:gajones76
  • 3
  • 2
  • 2
  • +1
9 Comments
 
LVL 16

Expert Comment

by:grahamnonweiler
ID: 20377974
You can achieve the same reuslt without any additional scripts as shown the attached snippet correspnding to your above line 8.


<input name="email" id="email" value="enter your email" size="20" onfocus="if(this.value=='enter your email') {this.value=''}" type="text" />

Open in new window

0
 

Author Comment

by:gajones76
ID: 20378037
thanks Graham. I have put your code into the form on this page only:

http://www.mokitaproductions.org/index.php?page=home

but, for some reason it is still not working....


0
 
LVL 16

Expert Comment

by:grahamnonweiler
ID: 20378112
You have part of the script missing...

should be:

onFocus="if(this.value=='enter your email')  { this.value='' }"

where the '' after the = in value are two single quotes.



0
Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

 
LVL 29

Expert Comment

by:Göran Andersson
ID: 20378146
The reason that the function that you used didn't work, is that you didn't specify the defaultValue argument that it uses:

<input name="email" id="email" value="enter your email" defaultValue="enter your email" size="20" onfocus="clearField(this)" type="text" />


Regardning the code that you are using now:

change

<input name="email" id="email" value="enter your email" size="20" onfocus="if(this.value=='enter your email') " type="text" />

to

<input name="email" id="email" value="enter your email" size="20" onfocus="if(this.value=='enter your email') { this.value=''; }" type="text" />
0
 

Author Comment

by:gajones76
ID: 20378382
thanks. however it still doesn't work:

http://www.mokitaproductions.org/index.php?page=form-test

the first time I load that page, the following error is displayed:

string(131) "Smarty error: [in globalcontent:mailinglist line 8]: syntax error: unrecognized tag: this.value='' (Smarty_Compiler.class.php, line 446)" string(119) "Smarty error: [in globalcontent:mailinglist  line 8]: syntax error: unrecognized tag '' (Smarty_Compiler.class.php, line 590)"

Subsequent reloads of the page remove the error, but also strip out the offfending code from the form:

{ this.value=''; }"

I'm using cmsmadesimple and wonder whether that has something to do with it. Whether i put the code directly into the page or in a content block the result is the same.
0
 
LVL 29

Expert Comment

by:Göran Andersson
ID: 20378628
The system that you are using uses brackets, which is unfortunate, as Javascript does too.

Fortunately, you don't need the brackets in this Javascript:

<input name="email" id="email" value="enter your email" size="20" onfocus="if(this.value=='enter your email') this.value='';" type="text" />
0
 

Author Comment

by:gajones76
ID: 20378674
thanks for that. In the end I found there is a {literal} tag in the CMS that you can wrap around to preserve the code.
0
 

Accepted Solution

by:
ee_auto earned 0 total points
ID: 25982783
Question PAQ'd, 500 points refunded, and stored in the solution database.
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question