[Solved] Second AJAX call to one div element not working

by


The jQuery function takes one function to execute on the document ready event, not two:

jQuery(
    function() {
        $("#profEdit").click(function() {
            $("#profInfo").load("profile_edit_info.php");
        });
        $("#profEditDone").click(function() {
            $("#profInfo").load("profile_info.php");
        });
    }
);

Chances are it was simply ignoring the second function because it doesn’t expect a second function parameter after executing the first one. Note also that if these #profEdit and #profEditDone elements are in any way replaced as a result of these AJAX operations then your click bindings will be lost. If that’s also happening you’ll want to use .on() instead and bind to a common parent element:

jQuery(
    function() {
        $(document).on("click", "#profEdit", function() {
            $("#profInfo").load("profile_edit_info.php");
        });
        $(document).on("click", "#profEditDone", function() {
            $("#profInfo").load("profile_info.php");
        });
    }
);

2

solved Second AJAX call to one div element not working