Reset a field after submitting text (HTML)

**Glaanieboy** · June 12th, 2003

Code:

<FORM target="right" action="right.php" name="submit_message" method="GET">
<INPUT type="hidden" name="showrows" value="15">
<?php 
print "Name: <INPUT type=\"text\" name=\"name\" maxlength=\"25\" size=\"25\" ><BR>";
?>
Message: <INPUT type="message" name="text" maxlength="255" size="25" value=""><BR>
<INPUT type="submit" value="SHOUT!"></FORM>

This is how it looks like currently (please don't pay attention to the PHP code). What I want is that after the form has been submitted, that it clears the 'Message' field. I found one piece of javascript code (onClick="reset(this.form)" placed in the final INPUT), but that resets the field before the string has been submitted.
Can anyone help me?

edit: removed some code to correct the posts' width.

**Zedric** · June 12th, 2003

I don't think it's possible without some tricks. You could make a hidden box.

PHP Code:


			
[...] onClick="submitIt()" [...]



function submitIt(){

  document.submit_message.theHidden.value = document.submit_message.message.value;

  document.submit_message.message.value = "";

  document.submit_message.submit();

}

This way the same effect should be reached. The message will now be in theHidden instead of message though so you might want to rename them a bit.

**Glaanieboy** · June 12th, 2003

OK, I have put the document.bla part in SCRIPT tags and onClick=bla in my INPUT submit button. Is that correct? Either way, nothing happens, I click the button, but no text is submitted to the db. Also the text stays put.

click here for a demo (this is not the shoutbox in my sig)

**Zedric** · June 13th, 2003

You seem to have removed the code again. You may need to have a type="button" instead of type="submit".

**Glaanieboy** · June 13th, 2003

LOL, yeah. I shall try it now.

**Glaanieboy** · June 13th, 2003

Hmm, nothing happens. Unfortunately I can't show the code properly atm, because I can't edit the file anymore somehow. I'll let you know when it's fully online again

**Glaanieboy** · June 13th, 2003

Weee, I done it! This is how:
First, I made the button a 'reset' type, instead of submit.
Added a Javascript (place between the <head></head> tags):

Code:

<SCRIPT language="JavaScript"><!--
function submitIt(){
document.submit_message.submit();
return true;
}
//--></SCRIPT>

Then, added this piece of code in the <FORM> declaration: onReset="return submitIt()".

With this code, it first sends out the form values, and then it resets the fields

(Because Name is cookied, Name is always filled in)
Thank you Zedric for pointing me in the right direction and thank you Google for the inspiration (I made this script myself with bits and pieces I found with Google).

**Glaanieboy** · June 13th, 2003

I had a problem with submitting the text properly. Now that I made the submit button a reset button, I can't press enter - while in the message field - to submit the text. I found a javascript that checks if the Enter key is pressed (while in the message box) and if so, it executes some commands (which is, in this case, submit the form and reset the message field). Here's the script:

Code:

function onKeyPress (){
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
else return true;
if (keycode == 13) {
document.submit_message.submit();
window.document.submit_message.message.value = '';
return false;
}
return true;
}
document.onkeypress = onKeyPress;

I test all my stuff in Mozilla, because it is most compatible with HTML and javascript. I thought. I just couldn't get this script to work, until I opened it in IE... it worked.
Now is my question, can someone look at this code and tell me what to change to make it work in Mozilla AND in IE? (and the rest of the browsers of course, but these are most widely used)

To see the script working: http://allhope.geffychan.co.uk/~glen...test/shout.php

**Zedric** · June 13th, 2003

This can be a bit tricky as I noticed in my HTPC interface project.
Mozilla does this one way, IE another and Opera a third. Well almost anyway.

PHP Code:


			
<SCRIPT language="JavaScript">

if((navigator.appName == "Netscape")&&(parseInt(navigator.appVersion) >= 4)) NS = true;

else NS = false;



if(NS){

    document.captureEvents(Event.KEYDOWN);

    document.onkeydown = getKey;

}



function getKey(e){

    if(NS) key = String.fromCharCode(e.which);

    else key = String.fromCharCode(event.keyCode);

    if(key == 13) document.submit_message.submit();

}

Netscape will do nicely on this code (captures whole document though!). IE needs the onKeyDown="getKey()" in the appropriate tag. Opera seems to use Unicode (or something), but that only applies to some buttons (the ones I wanted to use...). The enter button has the same code though.

**Glaanieboy** · June 13th, 2003

Nope does not work, not even in IE. I already put { and } at 'if (bla) { bla }' but that didn't work also. Do you have another suggestion?

**Zedric** · June 13th, 2003

That's extremely odd... I've tested this code in Mozilla, Opera and IE.

The

PHP Code:


			
if(NS){

    document.captureEvents(Event.KEYDOWN);

    document.onkeydown = getKey;

}

may have to be

PHP Code:


			
if(NS){

    document.submit_message.message.captureEvents(Event.KEYDOWN);

    document.submit_message.message.onkeydown = getKey;

}

in your case...

**Zedric** · June 13th, 2003

PHP Code:


			
if(escape(key) == "%0D")

seems to help a whole lot too...

if(key == 13) didn't cut it at all...

**Glaanieboy** · June 13th, 2003

Do I have to replace if (key == 13) with that line?

**Glaanieboy** · June 13th, 2003

Nevermind, got it to work! But it only works when you have document.captureEvents(Event.KEYDOWN); and document.onkeydown = getKey; and not the submit_message shiz in it.
Now I can sleep well (

) and finish the rest of the script.
Thank you very, very much!

**Zedric** · June 14th, 2003

Sweeet

**X-Istence** · June 15th, 2003

Javascript is crap.

**Glaanieboy** · June 15th, 2003

OK, X-Istence, then tell me a better way to do what I want.

**Zedric** · June 15th, 2003

I don't believe there is unless you count VBScript... He's just being like he always is.

But he's right, Javascript is crap...

[edit]Unless you do everything an entirely different way with the frames and all of course...

**Glaanieboy** · June 15th, 2003

Originally posted by Zedric
[edit]Unless you do everything an entirely different way with the frames and all of course...

How? I don't understand what you mean :huh:

**X-Istence** · June 15th, 2003

Well, do what all shoutboxes do, put the submit new message box inside the iframe, so that when its refreshed, it is empty

.

June 12th, 2003	Top \| #1
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Reset a field after submitting text (HTML) Code: <FORM target="right" action="right.php" name="submit_message" method="GET"> <INPUT type="hidden" name="showrows" value="15"> <?php print "Name: <INPUT type=\"text\" name=\"name\" maxlength=\"25\" size=\"25\" ><BR>"; ?> Message: <INPUT type="message" name="text" maxlength="255" size="25" value=""><BR> <INPUT type="submit" value="SHOUT!"></FORM> This is how it looks like currently (please don't pay attention to the PHP code). What I want is that after the form has been submitted, that it clears the 'Message' field. I found one piece of javascript code (onClick="reset(this.form)" placed in the final INPUT), but that resets the field before the string has been submitted. Can anyone help me? edit: removed some code to correct the posts' width.

June 12th, 2003	Top \| #2
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	I don't think it's possible without some tricks. You could make a hidden box. PHP Code: `[...] onClick="submitIt()" [...] function submitIt(){ document.submit_message.theHidden.value = document.submit_message.message.value; document.submit_message.message.value = ""; document.submit_message.submit(); }` This way the same effect should be reached. The message will now be in theHidden instead of message though so you might want to rename them a bit. Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 13th, 2003	Top \| #4
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	You seem to have removed the code again. You may need to have a type="button" instead of type="submit". Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 13th, 2003	Top \| #7
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Weee, I done it! This is how: First, I made the button a 'reset' type, instead of submit. Added a Javascript (place between the <head></head> tags): Code: <SCRIPT language="JavaScript"><!-- function submitIt(){ document.submit_message.submit(); return true; } //--></SCRIPT> Then, added this piece of code in the <FORM> declaration: onReset="return submitIt()". With this code, it first sends out the form values, and then it resets the fields (Because Name is cookied, Name is always filled in) Thank you Zedric for pointing me in the right direction and thank you Google for the inspiration (I made this script myself with bits and pieces I found with Google).

June 13th, 2003	Top \| #8
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	I had a problem with submitting the text properly. Now that I made the submit button a reset button, I can't press enter - while in the message field - to submit the text. I found a javascript that checks if the Enter key is pressed (while in the message box) and if so, it executes some commands (which is, in this case, submit the form and reset the message field). Here's the script: Code: function onKeyPress (){ var keycode; if (window.event) keycode = window.event.keyCode; else if (e) keycode = e.which; else return true; if (keycode == 13) { document.submit_message.submit(); window.document.submit_message.message.value = ''; return false; } return true; } document.onkeypress = onKeyPress; I test all my stuff in Mozilla, because it is most compatible with HTML and javascript. I thought. I just couldn't get this script to work, until I opened it in IE... it worked. Now is my question, can someone look at this code and tell me what to change to make it work in Mozilla AND in IE? (and the rest of the browsers of course, but these are most widely used) To see the script working: http://allhope.geffychan.co.uk/~glen...test/shout.php

Latest News Posts

Latest Forum Posts

Latest Member Blogs

June 12th, 2003	Top \| #3
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	OK, I have put the document.bla part in SCRIPT tags and onClick=bla in my INPUT submit button. Is that correct? Either way, nothing happens, I click the button, but no text is submitted to the db. Also the text stays put. click here for a demo (this is not the shoutbox in my sig)

June 13th, 2003	Top \| #5
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	LOL, yeah. I shall try it now.

June 13th, 2003	Top \| #6
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Hmm, nothing happens. Unfortunately I can't show the code properly atm, because I can't edit the file anymore somehow. I'll let you know when it's fully online again

June 13th, 2003	Top \| #9
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	This can be a bit tricky as I noticed in my HTPC interface project. Mozilla does this one way, IE another and Opera a third. Well almost anyway. PHP Code: `<SCRIPT language="JavaScript"> if((navigator.appName == "Netscape")&&(parseInt(navigator.appVersion) >= 4)) NS = true; else NS = false; if(NS){ document.captureEvents(Event.KEYDOWN); document.onkeydown = getKey; } function getKey(e){ if(NS) key = String.fromCharCode(e.which); else key = String.fromCharCode(event.keyCode); if(key == 13) document.submit_message.submit(); }` Netscape will do nicely on this code (captures whole document though!). IE needs the onKeyDown="getKey()" in the appropriate tag. Opera seems to use Unicode (or something), but that only applies to some buttons (the ones I wanted to use...). The enter button has the same code though. Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 13th, 2003	Top \| #10
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Nope does not work, not even in IE. I already put { and } at 'if (bla) { bla }' but that didn't work also. Do you have another suggestion?

June 13th, 2003	Top \| #11
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	That's extremely odd... I've tested this code in Mozilla, Opera and IE. The PHP Code: `if(NS){ document.captureEvents(Event.KEYDOWN); document.onkeydown = getKey; }` may have to be PHP Code: `if(NS){ document.submit_message.message.captureEvents(Event.KEYDOWN); document.submit_message.message.onkeydown = getKey; }` in your case... Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 13th, 2003	Top \| #12
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	PHP Code: `if(escape(key) == "%0D")` seems to help a whole lot too... if(key == 13) didn't cut it at all... Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 13th, 2003	Top \| #13
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Do I have to replace if (key == 13) with that line?

June 13th, 2003	Top \| #14
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Nevermind, got it to work! But it only works when you have document.captureEvents(Event.KEYDOWN); and document.onkeydown = getKey; and not the submit_message shiz in it. Now I can sleep well ( ) and finish the rest of the script. Thank you very, very much!

June 14th, 2003	Top \| #15
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	Sweeet Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 15th, 2003	Top \| #16
X-Istence * Joined: December 2001 Location: USA Posts: 6,496 Reputation: 2808 Power: 220	Javascript is crap. An engineers technical notebook

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
[HTML] Text revolving	Kev2012	Web Design & Coding	7	October 11th, 2004 7:20pm
[HTML]/[Javascript] Empty field on submit	Glaanieboy	Web Design & Coding	11	March 26th, 2004 4:00am
HTML text and stuff	Geffy	Web Design & Coding	6	February 3rd, 2003 9:08pm
help with HTML and text input spaces	jkoXP	Web Design & Coding	3	December 25th, 2002 11:02am
Interet Explorer "Text-Field History"	Cute	Windows Desktop Systems	4	August 15th, 2002 8:59pm

June 15th, 2003	Top \| #17
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	OK, X-Istence, then tell me a better way to do what I want.

June 15th, 2003	Top \| #18
Zedric NTFS Guru Joined: January 2002 Location: Sweden Posts: 4,006 Reputation: 890 Power: 175	I don't believe there is unless you count VBScript... He's just being like he always is. But he's right, Javascript is crap... [edit]Unless you do everything an entirely different way with the frames and all of course... Did I help you? Please use the reputation system. Click the icon on the left! Proud host of the OSNN.net folding sigs. Want one? Check the folding thread! http://zedric.no-ip.com/

June 15th, 2003	Top \| #19
Glaanieboy OSNN Veteran Addict Joined: March 2002 Location: The Netherlands Posts: 2,626 Reputation: 270 Power: 153	Originally posted by Zedric [edit]Unless you do everything an entirely different way with the frames and all of course... How? I don't understand what you mean :huh:

June 15th, 2003	Top \| #20
X-Istence * Joined: December 2001 Location: USA Posts: 6,496 Reputation: 2808 Power: 220	Well, do what all shoutboxes do, put the submit new message box inside the iframe, so that when its refreshed, it is empty . An engineers technical notebook