Question

I am simply looking to call a function when a form is loaded via ajax. My current code looks like this:

$('form').live("load",function() {...}

My ajax call looks like this:

jQuery.ajax({

                type: "get",
                url: "../design_form.php",
                data: "coll=App_Forms&form=Step_1_Company_Sign_Up",
                dataType: "html",
                success: function(html){                
                            jQuery('#Right_Content').hide().html(html).fadeIn(1000);

                }   

        })

I know that i could put my call inside the success portion of the ajax call but i am trying to minimize code and resuse other codes so i would really like to use the live feature.

I am loading a form via ajax and when that form is loaded i want to trigger a function using the jquery live. This works fine when i set it to “click”

$('form').live("click",function() {...} 

but it is unnecessary to run this function on every click, i just need it to run once on the form load so that is why i want to use the load listener not the click.

Thank you.

Answer 1

Edit: I think you wanted to have custom code inside success callback which will be used in different pages so you don’t want to duplicate the same ajax call in different pages. If so, then you should call a function inside that success callback and implement different version of that in different page.

    jQuery.ajax({
            type: "get",
            url: "../design_form.php",
            data: "coll=App_Forms&form=Step_1_Company_Sign_Up",
            dataType: "html",
            success: function(html){                
                  jQuery('#Right_Content').hide().html(html).fadeIn(1000);
                  afterFormLoad(); //Implement this function 
            }   

    });

    function afterFormLoad() { } //dummy function defined in the common code

And in your specific page,

    function afterFormLoad () {  
        //this is from page 1
    }

---

Below just shows you about .live/.die and .one incase if you want to understand how to unbind it using .die.

You can unbind .live inside the click handler using .die,

DEMO

$('form').live("click",function(e) {
    alert('clicked');
   $('form').die('click'); // This removes the .live() functionality
});

You can use .one if you are using jQuery 1.7. See below code,

DEMO

$(document).one('click', 'form', function() {
    alert('clicked');
});