JS/AJAX: Submit form with timer and not a button click or refresh of page

Question

I am trying to submit a form without page refresh or a submit button. But i have only achieved to have the JS function submit the input box value. Is it possible to submit the whole form without a button click and refresh of page?

JSFIDDLE

JS

            <script type="text/javascript">
                $(document).ready(function() {
                    var timer;
                        $('#yurl).on('keyup', function() {
                            var value = this.value;

                            clearTimeout(timer);

                            timer = setTimeout(function() {

                                //do your submit here

                                alert('submitted:' + value);
                            }, 2000);
                        });
                });
            </script>

html

                <form method="post" id="ytVideo" action="">
                <input id="yurl" type="text" value="<?php $url ?>" name="yurl">     
                </form>

I'm not sure if I understood your question correctly but based from what I understand you're trying to automatically submit a form once the time limit has been reached. Is that right? — Wern Ancheta
– Wern Ancheta, Commented Jul 13, 2012 at 1:52

ryuusenshi · Accepted Answer · 2012-07-13 01:59:48Z

1

If I understood well what you're asking, where it says //do your submit here you should put:

 $("#ytVideo").submit()

where ytVideo is the id of the form you're trying to submit

Good luck!

edited Jul 13, 2012 at 1:59

answered Jul 13, 2012 at 1:49

ryuusenshi

1,98613 silver badges15 bronze badges

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

3 Comments

user1434156 Over a year ago

Yes when i change to the form id. I get in the alert: submitted: undefined

ryuusenshi Over a year ago

I tried it in the JSFiddle you provided, and it worked out fine for me.

ryuusenshi Over a year ago

and sorry, I messed up, it should be $("#ytVideo").submit(), not $("ytVideo").submit()

Wern Ancheta · Accepted Answer · 2012-07-13 02:12:39Z

Your fiddle seems to be working but the problem is that you're not really submitting it anywhere.

<script type="text/javascript">
 $(document).ready(function() {
                        var timer;
                            $('#yurl).on('keyup', function() {
                                var value = this.value;

                                clearTimeout(timer);

                                timer = setTimeout(function() {

                                    //do your submit here
                                    $("#ytVideo").submit()
                                    alert('submitted:' + value);
                                }, 2000);
                            });


     //then include your submit definition. What you want to do once submit is executed
      $('#ytVideo').submit(function(e){
           e.preventDefault(); //prevent page refresh
           var form = $('#ytVideo').serialize();
           //submit.php is the page where you submit your form
           $.post('submit.php', form, function(data){ 
              //do something with the data

           });
      });

});
</script>

Haroldo_OK · Accepted Answer · 2012-07-13 01:51:10Z

0

I think jQuery.serialize() could solve your problem quite nicely.

answered Jul 13, 2012 at 1:51

Haroldo_OK

7,3033 gold badges50 silver badges86 bronze badges

Collectives™ on Stack Overflow

JS/AJAX: Submit form with timer and not a button click or refresh of page

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related