Tip: Clear Message Box

[bluephoenix]

I don't know about any of you but I've always found it annoying that when you're using a form there's a SUBMIT button and there's a CLEAR FORM button. If there's only two or three fields, clearing the form works great. But if it's a rather lengthy contact/feedback form it would be nice to have a button that just clears the message part of the form and leaves the rest of the fields alone.

It's not a new practice to change the value of fields in a form, but I honestly haven't seen this one implimented yet. It's a short and simple piece of code that I think exemplifies what JavaScript is supposed to do... nonintrusively enhance your webpage. And while nobody will probably ever use it it's very presence tells the viewer that the webdesigner cared enough to think of the little things!

Given a similar form:

<form action="sendform.php" method="post" name="feedback">
<p>
<!-- various input fields -->
Email Address: <input type="text" value="" size="37" name="email" /><br />
Subject: <input type="text" value="" size="37" name="subj" /><br />
Message: <textarea rows="8" cols="42" name="msg" wrap="virtual"></textarea><br />
<input type="submit" value="Send" />
<input type="button" value="Clear Message Field" onclick="clrMsg();" />
<input type="reset" value="Clear Entire Form" />
</p>
</form>


simply insert a function call similar to this in the head of the document:

<script type="text/javascript">
<!--
function clrMsg() {
document.forms.feedback.msg.value = '';
return true;
}
</script>

[bluephoenix]

simply insert a function call similar to this in the head of the document:

Well, not exactly like that... I forgot the closing of the comment tag that hides the script from older browsers.

<script type="text/javascript">
<!--
function clrMsg() {
document.forms.feedback.msg.value = '';
return true;
}
//-->
</script>

Much better... Hey, you could even have the Clear Message button displayed by JavaScript, too, so those without JavaScript capabilities wouldn't even see the button. Ah, the possibilities! :)

[whammy]

The possibilities stagger the mind. ;)

I actually use a few things like this here and there, to clear out certain values (for instance credit card information, if someone chose to be "billed" and accidentally filled in CC info).

I also check to make sure javascript is enabled, however using a server-side script that requests a value from a hidden field on the first page that was written using javascript's "document.write()".

[bluephoenix]

See, that's cool! I think these are the type of javascript codes and ideas that should be circulating the net... not "look at my mouse trail!"

00 I've only seen one mouse trail I ever liked. it was very subtle and I wanted to go back and look at their code. but I've since lost the site.

it's probably for the best anyway :)

We should start a survery... what's the most creative use for JavaScript you've seen.