Question

I have a Django form that needs to do some client-side validation before submitting the form. This is the code in the template:

<form action="/{{ blog_entry.id }}/addComment/" method="post">
{{ commentForm.name.label_tag }} 
{{ commentForm.name }}
<span id="spanNameReq" style="color:Red; display:none;">Required</span>
<br />     
{{ commentForm.email.label_tag }} 
{{ commentForm.email }}
<span id="spanEmailReq" style="color:Red; display:none;">Required</span>
<span id="spanEmailInvalid" style="color:Red; display:none;">Invalid e-mail address</span>
<br />
{{ commentForm.website.label_tag }} 
{{ commentForm.website }}
<span id="spanWebsiteInvalid" style="color:Red; display:none;">Invalid URL</span>
<br />    
{{ commentForm.comment.label_tag }} 
<span id="spanCommentReq" style="color:Red; display:none;">Required</span>   
<br />
{{ commentForm.comment }}
<br />  
<input type="submit" value="Add comment" onclick="javascript:var ret = validateComment(); return ret;" />  
</form>

But the problem is that validateComment does not get called at all, and the form gets submitted straight away.
Strangely enough if I replace the onclick event with

javascript:alert('test');

or

javascript:return false;

that JS code gets executed fine (and in the second case it won’t submit the form).

Why does it not execute the function I specified?
Just to confirm that I have included the script file in the HTML head (including the JS code embedded in the template does not make a difference), and if I don’t use a Django form, but a normal HTML form it works fine.

Answer 1

I don’t think your function is being called. My hunch is you have have misspelled something. Try putting an alert() in your function.