form validation alerts but still submits form

[jarv]

I just want to validate my form but after clicking on "OK" on the JavaScript Alert box, my form still submits?!

Please help... below is my Javascript

<script>
   
function notEmpty(){
	var myTextField = document.getElementById('emailaddress');
	if(myTextField.value == "")
		alert("Please enter a valid email address");
}

   function submit_vote(obj) {
   	  
	  var vote_value = getCheckedValue(document.forms['vote-form'].elements['opt']);
      var poststr = "poll_id=" + encodeURI( document.getElementById("poll_id").value ) +
      				"&emailaddress=" + encodeURI( document.getElementById("emailaddress").value ) +
                    "&voteid=" + encodeURI( vote_value);				
      makeVote('vote.php', poststr);
   }
</script>

[Philip M]

alert("Please enter a valid email address");
return false;


Form validation of the pattern if(myTextField.value == ") is barely worthy of the name, and virtually useless, as even a single space, an X or a ? will return false, that is pass the validation. Numeric values, such as zip codes and phone numbers, should be validated as such. Ditto email addresses. This topic has been covered many times before in this forum.


In the first book of the Bible, Guinness, God got tired of creating the world so he took the Sabbath off. - Pupil's answer to Catholic Elementary School test.

[WolfShade]

You are calling two functions that you did not include (getCheckedValue and makeVote).

I am not sure, but I don't think var name = "data" +
"more data" +
"even more"; is valid or good JS. Try var name = "data";
name += "more data";

[Logic Ali]

Originally Posted by jarv

I just want to validate my form but after clicking on "OK" on the JavaScript Alert box, my form still submits?!

What part of your code do you think should prevent the form from submitting?

[Old Pedant]

Originally Posted by WolfShade

I am not sure, but I don't think var name = "data" +
"more data" +
"even more"; is valid or good JS.

WHAT???

Pardon, but how did you come by that belief?

Of course it's both valid and good JavaScript.

The + operator, whether used to really do arithmetic addition or string concatenation, returns the added/concatenated value as its result. So of course you can then add or concatenate further.

If you don't think that's legal, look at this:
http://www.codingforums.com/showpost...2&postcount=10

Look at the next to last statement in all that JS code.

NewCode =  topR + midR + name + ": " + sign +" "+ plevel 
        + "<BR> XP: "+ (EXP-showxp) 
        +"<BR> Experience needed: " +  (xpup-EXP)
        + "<BR>Overall Experience:" + (xneeded * EXP / xneeded) 
        +"<br><!-- placeholder --><br><br>"

(It's not very good HTML, but it's perfectly legal and correct JavaScript code.)

[Old Pedant]

If you can't string operators together to create an expression, how would you do stuff like

var area = 3.14159265 * radius * radius;
var volume = width * length * height;
var total = cost + tax + shipping + handling;

[jarv]

I tried adding return false;

the form still submits?!

[Philip M]

Originally Posted by jarv

I tried adding return false;

the form still submits?!

Show us your HTML <form> tag

[Logic Ali]

Originally Posted by jarv

I tried adding return false;

the form still submits?!

Then you're probably doing <form onsubmit="myFunction()" ...> when it should be <form onsubmit="return myFunction()" ...>

[jarv]

thanks that worked, now I can;t submit the form

PHP Code:

$showpoll = '<span id="vote_msg">
            <form name="vote-form" action="javascript:submit_vote(document.getElementById(\'vote-form\'));" id="vote-form" method="post">
            <b style="font-size:13px;">'.$question.'</b>
            <ol id="poll-options">'.$options.'
            </ol>
            Email address:<br /><input type="text" name="emailaddress" id="emailaddress" /><br /><br />
            Renewal Date:<br /><input type="text" tabindex="1" class="date demo" name="renewaldate" id="renewaldate" readonly=""><br /><br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" name="vote" onclick=\'return notEmpty()\' id="vote" value="Submit Vote" />
            </form>
  <div align="right"><a href="javascript:getpage(\'wp-content/themes/boat-zone/result.php?poll_id='.$pid.'\', \'vote_msg\');" class="readmore3" id="view-poll" >View poll results</a>&nbsp;&nbsp;&nbsp;</div><br>    
            </span>';
}else{  
    $showpoll = '<span id="vote_msg"><p style="text-align:center">You have voted already</p>';
    
    $showpoll .= '<div align="right"><a href="javascript:getpage(\'wp-content/themes/boat-zone/result.php?poll_id='.$pid.'\', \'vote_msg\');" class="readmore3" id="view-poll" >View poll results</a>&nbsp;&nbsp;&nbsp;</div></span>'; 


[jarv]

Can anyone help me here?

[Logic Ali]

Originally Posted by jarv

action="javascript:submit_vote(document.getElementById(\'vote-form\'));"

Who taught you to do that? That is not the purpose of the action parameter.

Any function(s) executed on submit should be called either by the onsubmit handler or the submit button's onclick event. Preferably not both.

Never use "javascript:", it's not necessary.

[Old Pedant]

In fact, the action= can *NOT* be JavaScript. Period.

<form action="vote.php" method="post" onsubmit="return submit_vote(this);" >

But if your function submit_vote() still looks like it did in your first post in this thread, then it is COMPLETELY UNNECESSARY!

The browser will *AUTOMATICALLY* encode all your <form> elements for you and will automatically send them as a post-date string when the <form> is submitted.

If you are trying to do this as an AJAX call, then you are going about it all wrong. If this is the case, then show us the code for your make_vote( ) function.