jquery using .submit() form not submitting

Question

I am submitting a form using jQuery but when I use JavaScript it is submitted but through jQuery it is not submitting.

Here is my form code:

<form method="post" id="uploadfrm" action="<?php echo site_url('filemanager/upload'); ?>" enctype="multipart/form-data" >
<div class="up_wraper">Click here to Select a File </div>
<input type="file" name="upload[]" id="upload" multiple="multiple" /> </form>

jQuery code:

<script type="text/javascript">
   $(document).ready( function() {
       $("#upload").change( function() { 
        var value=$("#foo").val();
        var file=$("#upload").val();
        var arr = value.split("_");
        var id = arr[1];
        var type = arr[0];

        if(type!='folder'){
            alert('Select a folder to upload files..!');
            }
          else{
                 $("#foo").val(id);
                 $('#uploadfrm').submit( function(event) {
                 event.preventDefault();

                 });

            }
       });
   });
</script>

When I use in else condition:

document.forms["uploadfrm"].submit();

it submits successfully.

But I want to submit it using jQuery using preventDefault() method.

So you want to submit a form, but prevent it from submitting? — BenM
– BenM, Commented Jul 23, 2013 at 10:47
Why you want event.preventDefault();it prevents from form submission — Arun Bertil
– Arun Bertil, Commented Jul 23, 2013 at 10:50
By using preventdefault form submit but its not refresh the browser window.. — Muhammad Saqlain Arif
– Muhammad Saqlain Arif, Commented Jul 23, 2013 at 10:50
Delete this line event.preventDefault(); and the form will submit i think. — Nil'z
– Nil'z, Commented Jul 23, 2013 at 10:54

Reinstate Monica Cellio · Accepted Answer · 2013-07-23 10:47:49Z

1

In your code you have this...

$('#uploadfrm').submit( function(event) {
    event.preventDefault();
});

The 2nd line, event.preventDefault();, stops the form submitting. If you remove that it will submit fine. Just do this...

$('#uploadfrm').submit();

answered Jul 23, 2013 at 10:47

Reinstate Monica Cellio

26.2k6 gold badges54 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

BenM Over a year ago

@saqlain786 Huh? Not it isn't. preventDefault does exactly what it says on the tin. The event still occurs, but the form does not submit. Don't get them confused.

Muhammad Saqlain Arif Over a year ago

@ BenM hmmm..ok i am just trying..wait a moment.

Reinstate Monica Cellio Over a year ago

saqlain786 - if this isn't what you need then give us a bit more info. The submit and refresh are the same thing.

Nikola Kirincic · Accepted Answer · 2013-07-23 11:14:00Z

0

You don't need event.preventDefault(); Simple $('#uploadfrm').submit(); triggers form submission. However, if you want to process some validations before submission, you can add another $.submit(); before your submission trigger.

    $('#uploadfrm').submit(function(){
      //your code goes here. 
     //return false; //if you want to break submission on failed validation, or if you want to use ajax callback
     //return true; // if you want to submit with regular form request. 
    });

   //this line bellow goes in your conditional, while upper one goes out of your $('#upload').change(); //event
   $('#uploadfrm').submit();

answered Jul 23, 2013 at 11:14

Nikola Kirincic

3,7871 gold badge28 silver badges32 bronze badges

Collectives™ on Stack Overflow

jquery using .submit() form not submitting

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related