[HTML]/[Javascript] Empty field on submit

Discussion in 'Web Design & Coding' started by Glaanieboy, Mar 13, 2004.

  1. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    OK, on my website (http://glaanieboy.dyndns.org/design) I have a shoutbox. The shouts are placed in an <iframe>, but the form is on the main page. The form has a target="<iframe_name>" and it works well. But, when I click submit, the text I filled in the Message box stays and I want it to dissappear, so only the name is visible (the name is loaded by a cookie btw).
    I hope you know what I mean, if not, explain what you don't understand and I'll try to clarify.

    I remember asking this question on the 'old' NTFS a year ago when I had my old, sluggish shoutbox, but I lost the files, so I can't see if it was solved back then :p
     
  2. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    Alright, i have done a little more research, and I have found a rather large list with javascript thingies here: http://www.juicystudio.com/tutorial/javascript/document.asp, but to be honest, I don't have a clue how to handle it. The problem here is, is that there are two pages involved, one with the data and one with the form. Somehow, I want that when the data page is loaded, one field in the other page with the form will get erased. I know you can do that by using the onLoad function in the body element on the data page, but I have no idea how. Help me!
     
  3. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    *cough*
     
  4. X-Istence

    X-Istence * Political User

    Messages:
    6,498
    Location:
    USA
    write a javascript, that gets used when the user clicks submit, onbuttonpress or whatever, and tell it to set the values back to nill.
     
  5. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    OK, I now have changed the submit button in a normal button and added a new value called onClick="javascript:clearText(shout)"> (shout is the name if the field to be deleted). I use this function:
    Code:
    function clearText(incoming){
       document.form.submit();
       incoming.value = "";
    }
    It submits, and the new shout appears on the shoutbox. Nothing else. I added a alert('bla'); function to it, to see if it does something after it submits, but no alert box. When I leave the document.for.submit() thingy out, it clears the field correctly. How can I solve this?
     
  6. X-Istence

    X-Istence * Political User

    Messages:
    6,498
    Location:
    USA
    Well, i believe you have to use the form name, as so: document.formname.submit().
     
  7. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    Oh yeah baby!!!! It works! Thanks :D
     
  8. X-Istence

    X-Istence * Political User

    Messages:
    6,498
    Location:
    USA
    Not a problem :)
     
  9. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    Then I have one tiny problem. Because I rebranded the button as a "button", instead of "submit", it doesn't respond to the enter key, I have to click the button to submit it. I know there was a solution for it on the old NTFS, but I forgot. I believe it was also a javascript thingy.
     
  10. X-Istence

    X-Istence * Political User

    Messages:
    6,498
    Location:
    USA
    You should be able to use submit for it just like before. onClick should work the same.
     
  11. Glaanieboy

    Glaanieboy Moderator

    Messages:
    2,626
    Location:
    The Netherlands
    I now have this:
    Code:
    function clearText(incoming){
      document.shoutform.submit();
      incoming.value = "";
    }
    and
    Code:
    <form method="post" action="shout.php?action=newmess" target="shoutbox" name="shoutform">
    Name:<br><input type="text" name="name" value="">
    Message:<br><input type="text" name="shout" value=""><br>
    <input type="button" value="Shout!" onClick="javascript:clearText(shout);">
    </form>
    This works (except for the Enter/Return-key bit), but when I use your suggestion and change the button type to "submit", it only clears the text, nothing else. I have tried changing the onClick to onSubmit, then I tried placing the onSubmit in the <form>, I have tried commenting the submit bit in the function out, but it all didn't work.
    Suggestions?
     
  12. ignipotentis

    ignipotentis OSNN Addict

    Messages:
    127
    don't use a button. use a standard hyperlink. <a href="foo" onClick="bar"><img...></a>

    You will be able to tab to your "button" and use the enter key.

    Hope this helps.