Get id of triggered updatepanel only

Question

I have two distinct updatepanels on my page and each of them have triggered by different buttons that are placed in different repeaters, updapenels work properly and to avoid from conflict i had setted their UpdateMode="Conditional" but i can't determine the id of updapanel which is triggering.

In InitializeRequest and EndRequest events, i need to determine which updatepanel triggered and then i can do some client-side animations specified on this updapanel.

Thanx.

Answer 1

So after all researches, the best practice looks like that:

Using Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequest) and Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(InitializeRequest)

i added all my triggers a data attribute like

<asp:LinkButton Text="Detay" data-sid="PickAppToShow" CssClass="btn btn-default btn-sm" ID="lbtSelectApplication" runat="server" /></td>

and at the request handlers look like that

    function InitializeRequest(sender, args) {
    try {
        var consernedObject = getAjaxObjectFromSender(sender);
        consernedObject.Start();

    }
    catch (e) {
        fn_ErrorLog(e);
    }
   };

function EndRequest(sender, args) {
    try {
        var consernedObject = getAjaxObjectFromSender(sender);
        consernedObject.End();

    }
    catch (e) {
        fn_ErrorLog(e);
    }


};

helper method is like :

function getAjaxObjectFromSender(sender) {
    var poster = sender._activeElement;
    if (poster == null) {
        return DefaultObject;
    }
    var posterSid = poster.getAttribute('data-sid');
    if (posterSid == null) {
        return DefaultObject;
    }
    var consernedObject = window[posterSid];
    if (consernedObject == null) {
        return DefaultObject;
    }
    return consernedObject;
}

The trick is starting now, as you had seen above window[posterSid] gives you the given named js object. if you check my RequestHandlers; they are using two methods as consernedObject.Start(); and consernedObject.End(); which are predefined in another js file named AjaxObjects.

For example :

var DefaultObject = {
    Start: function () {
        //When Progress Start    
        App.blockElement($(window), "Pleae wait");
    },
    End: function () {
        //When Progress End
        App.unblockElement($(window));
    }
};

var PickAppToShow = {
    Start: function () {
        //When Progress Start    
        App.blockElement($("#app-detail-content"), "Asking To Server");
    },
    End: function () {
        //When Progress End
        App.unblockElement($("#app-detail-content"));
    }
};


var PickMemberToDetail = {
    Start: function () {
        //When Progress Start    
        App.blockElement($(window), "Wait For It");
    },
    End: function () {
        //When Progress End
        $("#modal-MembershipDetail").modal("show");
        App.unblockElement($(window));
    }
};

This method have solved all my problems but one that i need to take a parameter from serverside, which can be achived by using hiddenField.