CODEWITHSUNDEEP
javascripthtmlfunctionjquery
tmparisi
tmparisi

Reputation: 111

Calling JQuery event as function from elsewhere in code...?

Okay, pretty straight forward JQuery question that I am struggling to find an answer for:

I have a JQuery event that is called on button click:

$(document).ready(function(){
        resetForms('reservation');
        $('#form-reservation').submit(function(event){ 
            event.preventDefault();  //the page will no longer refresh on form submit.
            var resCheck = $(this).find('input[class="reservationid"]').val(); //now we have the reservation ID, let's perform our check.
            document.cancel_res.cancel_agree.checked = false;
            //document.cancel_res.cancel_agree.disabled = false;
            document.cancel_res.cancel_button.disabled=true;
            document.form_reservation.search_button.value="Searching...";
            document.form_reservation.search_button.disabled=true;
            $.ajax({ 
                url: 'inc/searchres.php', 
                type: 'POST',
                data: 'resid='+resCheck, 
                success: function(data){  //data is all the info being returned from the php file 
                    resetForms('reservation');  //clear forms
                    document.form_reservation.search_button.value="Search Reservation";
                    document.form_reservation.search_button.disabled=false;
                    $('#reservation-id').val(resCheck);  //add read ID back into text box
                    var jsonData = $.parseJSON(data);
                    //BLAH BLAH BLAH BLAH
                }
            });
        });
    });

The function works perfectly... however, is there anyway to call this function without utilizing the submit event? I tried to take out everything after the $('#form-reservation').submit(function(event){ call and place it in a separate function, and then call the function from the submit event. However, for whatever reason, this failed.

Basically, I want the submit event to still trigger this function, but I also want to be able to call the entire function under other circumstances. Thanks in advance!

Upvotes: 1

Views: 1224

Answers (2)

Kevin B
Kevin B

Reputation: 95022

I would simply trigger the handler.

$("#form-reservation").triggerHandler("submit");

http://api.jquery.com/triggerHandler/

As per the api docs, this does not cause the form to submit, it just run's the handlers bound to that event.

Upvotes: 1

philwinkle
philwinkle

Reputation: 7056

It's actually pretty easy:

var MyFunc = function(event){ 
            typeof event !== 'undefined' ? event.preventDefault() : false;  //the page will no longer refresh on form submit.
            var resCheck = $(this).find('input[class="reservationid"]').val(); //now we have the reservation ID, let's perform our check.
            document.cancel_res.cancel_agree.checked = false;
            //document.cancel_res.cancel_agree.disabled = false;
            document.cancel_res.cancel_button.disabled=true;
            document.form_reservation.search_button.value="Searching...";
            document.form_reservation.search_button.disabled=true;
            $.ajax({ 
                url: 'inc/searchres.php', 
                type: 'POST',
                data: 'resid='+resCheck, 
                success: function(data){  //data is all the info being returned from the php file 
                    resetForms('reservation');  //clear forms
                    document.form_reservation.search_button.value="Search Reservation";
                    document.form_reservation.search_button.disabled=false;
                    $('#reservation-id').val(resCheck);  //add read ID back into text box
                    var jsonData = $.parseJSON(data);
                    //BLAH BLAH BLAH BLAH
                }
            }

$(document).ready(function(){
        resetForms('reservation');
        $('#form-reservation').submit(MyFunc); //this calls on submit
    });

//this calls without need of a submit
MyFunc();

Upvotes: 2

Related Questions