if form empty or default text, then no action/reload page?

Discussion in 'JavaScript' started by monkeyclap, Mar 5, 2010.

0
  1. #1
    hi, i have this in my form:

    <input type="text" value="Enter Keywords" onfocus="if(this.value=='Enter Keywords'){this.value='';}" />
    HTML:
    and it works great, but how can i add to it to so that if the form is empty or default text (i.e. "Enter Keywords"), then no action is taken (i.e. cannot submit) or maybe just to make it reload page?

    cheers
     
    monkeyclap, Mar 5, 2010 IP
  2. s_ruben

    s_ruben Active Member

    Messages:
    735
    Likes Received:
    26
    Best Answers:
    1
    Trophy Points:
    78
    #2
    A simple example to do it:

    
<html>

<head>
  <title>Enter Keywords</title>
</head>

<body>

<form name="enter_keywords_form" id="enter_keywords_form" method="post">
<input id="enter_keywords" type="text" value="Enter Keywords" onfocus="if(this.value=='Enter Keywords'){this.value='';}" onblur="if(this.value==''){this.value='Enter Keywords';}" /> <input type="button" value="Submit" onclick="if(document.getElementById('enter_keywords').value!='' && document.getElementById('enter_keywords').value!='Enter Keywords'){ document.enter_keywords_form.submit(); }">
</form>

</body>

</html>
    Code (markup):
     
    s_ruben, Mar 6, 2010 IP
    monkeyclap likes this.
  3. monkeyclap

    monkeyclap Active Member

    Messages:
    836
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    85
    #3
    if the field is left blank or "Enter Keywords", then i do not want the form to be submited. how would i change the following please? thanks again!

     
    monkeyclap, Mar 6, 2010 IP
  4. s_ruben

    s_ruben Active Member

    Messages:
    735
    Likes Received:
    26
    Best Answers:
    1
    Trophy Points:
    78
    #4
    I didn't understand what you want. Doesn't the script work correctly? Explain in details, please.
     
    s_ruben, Mar 6, 2010 IP
  5. killaklown

    killaklown Well-Known Member

    Messages:
    2,666
    Likes Received:
    87
    Best Answers:
    0
    Trophy Points:
    165
    #5
    remove that onClick stuff from the button and put this in the form tag:

    
onSubmit="if(document.getElementById('enter_keywords').value=='' || document.getElementById('enter_keywords').value=='Enter Keywords'){ return false; }"
    Code (markup):
     
    killaklown, Mar 6, 2010 IP
    monkeyclap likes this.
  6. s_ruben

    s_ruben Active Member

    Messages:
    735
    Likes Received:
    26
    Best Answers:
    1
    Trophy Points:
    78
    #6
    Here is the code you want:

    
<html>

<head>
  <title>Enter Keywords</title>
</head>

<body>

<form name="enter_keywords_form" id="enter_keywords_form" method="post">
<input id="enter_keywords" type="text" value="Enter Keywords" onfocus="if(this.value=='Enter Keywords'){this.value='';}" onblur="if(this.value==''){this.value='Enter Keywords';}" /> <input type="button" value="Submit" onclick="if(document.getElementById('enter_keywords').value!='' && document.getElementById('enter_keywords').value!='Enter Keywords'){ document.enter_keywords_form.submit(); }">
</form>

</body>

</html>
    Code (markup):
    What doesn't work?
     
    s_ruben, Mar 6, 2010 IP
  7. monkeyclap

    monkeyclap Active Member

    Messages:
    836
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    85
    #7
    this is what i got atm, but it's not working...

     
    monkeyclap, Mar 6, 2010 IP
  8. s_ruben

    s_ruben Active Member

    Messages:
    735
    Likes Received:
    26
    Best Answers:
    1
    Trophy Points:
    78
    #8
    replace onSubmit to onclick.
     
    s_ruben, Mar 6, 2010 IP
  9. monkeyclap

    monkeyclap Active Member

    Messages:
    836
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    85
    #9
    ah, great stuff, all sorted now! thanks

    noticed on IE that it still lets you submit the form if you hit enter instead of the button, but that's just because IE sucks?
     
    monkeyclap, Mar 6, 2010 IP
  10. killaklown

    killaklown Well-Known Member

    Messages:
    2,666
    Likes Received:
    87
    Best Answers:
    0
    Trophy Points:
    165
    #10
    are you using onClick or onSubmit? if onClick then yea, it will still submit if you hit enter.
     
    killaklown, Mar 7, 2010 IP