Page 1 of 2
Clearing a textarea on submit
Posted: Wed Sep 14, 2005 12:17 pm
by evilmonkey
Hello,
I have a textarea in which a user can input some information, and I have a submit button. The form is submitted into another frame, therefore, the textarea isn't cleared automatically and I need to do that using javascript. I use the onClick property of the submit button to call the following code:
Code: Select all
function clearText(thefield){
if (thefield.defaultValue==thefield.value)
thefield.value = ""
}
Here's the code for my submit button:
Code: Select all
<input type="image" name="submit" value="newshout" onclick="clearText(shout)" src="images/button_overlay.gif" alt="" width="56" height="14" border="0">
The problem is, when submission fails (there's a php check in the recieving script), the textarea clears. When there's no error, the textarea doesn't clear. This really puzzles me because the javascript code has nothing to do with the recieving script, it's in the same file as the textarea and the submit button. Can anyone see a problem? I see one already: I don't know javascript.
Thanks.

Posted: Wed Sep 14, 2005 12:36 pm
by Chris Corbyn
Code: Select all
<textarea id="shout" name="shout"></textarea>
<input type="image" name="submit" value="newshout" onclick="sendAndClear('shout')">
and the function
Code: Select all
function sendAndClear(what)
{
document.forms[0].submit();
document.getElementById(what).value = '';
}
EDIT | Something doesn't look right here

Posted: Wed Sep 14, 2005 6:32 pm
by evilmonkey
Doesn't work, submits but doesn't clear...BTW, it's not form[0] because there are other forms on the page, i just referenced the form by name. document.shoutbox.submit()
Posted: Wed Sep 14, 2005 6:35 pm
by feyd
any element matching "submit" needs to be renamed. form.submit() will call that object instead of the method.
Posted: Wed Sep 14, 2005 6:55 pm
by ryanlwh
Code: Select all
onclick="clearText(document.shoutbox.shout)"
Posted: Wed Sep 14, 2005 7:43 pm
by evilmonkey
Feyd, can you please elaborate? I got the feild to clear, but the problem is it clears first, then submits, thereby submitting a blank message. I got the field to clear by writing a new function,
Code: Select all
function ClearText(what) { //I renamed the other function to clearDefaultText, look up and you'll see why
what.value="";
}
and calling it with
Now, I'm faced with the other problem. Suggestions welcome.

Posted: Wed Sep 14, 2005 11:14 pm
by feyd
ya execute the submit, yar, th'n ya do the clear, yar?
Posted: Wed Sep 14, 2005 11:18 pm
by s.dot
Code: Select all
HTML
<textarea id="someid">
JS
document.getElementById("someid").value = '';
Posted: Wed Sep 14, 2005 11:52 pm
by ryanlwh
evilmonkey wrote:Feyd, can you please elaborate? I got the feild to clear, but the problem is it clears first, then submits, thereby submitting a blank message. I got the field to clear by writing a new function,
Code: Select all
function ClearText(what) { //I renamed the other function to clearDefaultText, look up and you'll see why
what.value="";
}
and calling it with
Now, I'm faced with the other problem. Suggestions welcome.

oh so onclick has cleared the text before the form has submitted.
have you defined names in the frameset? if so, when the other frame loads
Code: Select all
<body onLoad=" top.nameOfFirstDocument.shout.value='' ">
Posted: Thu Sep 15, 2005 3:58 pm
by evilmonkey
ryanlwh wrote:evilmonkey wrote:oh so onclick has cleared the text before the form has submitted.
have you defined names in the frameset? if so, when the other frame loads
Code: Select all
<body onLoad=" top.nameOfFirstDocument.shout.value='' ">
And if not?

The iframe to which the submit goes has a name, but I don't think the main frame has one.
Posted: Thu Sep 15, 2005 3:59 pm
by evilmonkey
feyd wrote:ya execute the submit, yar, th'n ya do the clear, yar?
LOL thanks feyd, I was more wondering on HOW to do it. I understand that that's what I have to do.

Posted: Thu Sep 15, 2005 4:43 pm
by raghavan20
this can be an alternative to your problem
Code: Select all
<form name = 'frmNew' action="" method="get">
<textarea name='ta' rows='5' cols='30'>
</textarea>
<input type = 'button' name='sub' value='submit' onclick = 'form.submit(); document.frmNew.ta.value=""' />
</form>
Posted: Thu Sep 15, 2005 6:13 pm
by evilmonkey
raghavan20 wrote:this can be an alternative to your problem
Code: Select all
<form name = 'frmNew' action="" method="get">
<textarea name='ta' rows='5' cols='30'>
</textarea>
<input type = 'button' name='sub' value='submit' onclick = 'form.submit(); document.frmNew.ta.value=""' />
</form>
Won't work, my submit isn't a button, it's an image which submits the form, and the <img> tag doesn't have the onclick property...
Posted: Thu Sep 15, 2005 6:15 pm
by ryanlwh
you forgot input type="image"?
Posted: Fri Sep 16, 2005 4:33 am
by raghavan20
may be you should try this
Code: Select all
<form name = 'frmNew' action="" method="get">
<textarea name='ta' rows='5' cols='30'>
</textarea>
<a href ='#' onclick = 'form.submit(); document.frmNew.ta.value=""'><img src='yourimage.gif'/></a>
</form>