Question

Problem solved. Code is correct. It is the interaction between Angularjs and Jquery. Will work if you are only using Jquery

I am trying to add an extra checking method in my form submit. I am using the Jquery submit function here

Below is my code

HTML

<form id="upload_form" action="javascript:console.log('submitted');">
<table class="tablestyle">
    <tr>
        <td class="labelstyle" style="width:80px;">File</td>
        <td class="datastyle">
<input type="file" class="textinput" tabindex="7" id="file" name="file">
<input id="upload" name="upload" class="button" value="Upload" tabindex="8" type="submit"></td>
    </tr>   
</table>    
</form>

Javascript

$("#upload_form").submit(function() {
    console.log("checking");
});

however, when i submit, only the “javascript:console.log(‘submitted’);” is printed in my console. Can’t get the “console.log(“checking”);” to work.

Anyone knows what is the issue?

Any help is appreciated! Thank you.

Answer 1

There is no error on your code.

I have created a fiddle to prove that with your code : http://jsfiddle.net/tzjcA/

All log messages are printed

$("#upload_form").submit(function() {
    console.log("checking");
});​

EDIT

Press F12 then “console” tab

EDIT 2

Precise enctype method and remove javascript:console.log('submitted');

<form id="upload_form" enctype="multipart/form-data" method="post">
<table class="tablestyle">
    <tr>
        <td class="labelstyle" style="width:80px;">File</td>
        <td class="datastyle">
<input type="file" class="textinput" tabindex="7" id="file" name="file">
<input id="upload" name="upload" class="button" value="Upload" tabindex="8" type="submit"></td>
    </tr>   
</table>    
</form>