업데이트 패널 포스트 백 후 JavaScript 콜백을 실행하는 방법은 무엇입니까?

업데이트 패널 포스트 백 후 JavaScript 콜백을 실행하는 방법은 무엇입니까?

---

사용자가 페이지의 특정 요소를 가리킬 때 도움말 팁을 표시하기 위해 jQuery 팁 플러그인을 사용하고 있습니다.

CSS 선택기를 사용하여 페이지를로드 한 후 플러그인 이벤트를 등록해야합니다.

문제는 ASP.NET 업데이트 패널을 사용하고 있으며 첫 번째 포스트 백 후 업데이트 패널이 페이지 콘텐츠를 대체하지만 자바 스크립트 이벤트를 리 바인드하지 않기 때문에 팁이 작동하지 않는다는 것입니다.

업데이트 패널이 콘텐츠를 새로 고친 후 자바 스크립트 콜백을 실행하는 방법이 필요하므로, 팁이 다시 작동하도록 자바 스크립트 이벤트를 리 바인딩 할 수 있습니다.

이것을 할 방법이 있습니까?

---

jQuery 코드를 안에 넣는 대신 안에 $(document).ready()넣으십시오.

function pageLoad(sender, args) { 
    ... 
}

pageLoad모든 포스트 백, 동기 또는 비동기 후에 실행됩니다. pageLoadASP.NET AJAX에서이 용도로 예약 된 함수 이름입니다. $(document).ready()반면 DOM이 처음 준비 /로드 될 때 한 번만 실행됩니다.

ASP.NET AJAX 클라이언트 수명주기 이벤트 개요를 참조하세요.

---

pageLoad가 작동하지 않았습니다. 대신 이것을 사용했습니다.

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(pageLoaded);

function pageLoaded() {
}

---

이것은 아마도 가장 우아한 솔루션과는 거리가 멀지 만 그럼에도 불구하고 솔루션입니다.

public class UpdatePanel : System.Web.UI.UpdatePanel
{
    /// <summary>
    /// Javascript to be run when the updatepanel has completed updating
    /// </summary>
    [Description("Javascript to be run when the updatepanel has completed updating"),
        Category("Values"),
        DefaultValue(null),
        Browsable(true)]
    public string OnUpdateCompleteClientScript
    {
        get
        {
            return (string)ViewState["OnUpdateCompleteClientScript"];
        }
        set
        {
            ViewState["OnUpdateCompleteClientScript"] = value;
        }
    }

    protected override void OnPreRender(System.EventArgs e)
    {
        base.OnPreRender(e);
        if(!string.IsNullOrEmpty(this.OnUpdateCompleteClientScript))
            Page.ClientScript.RegisterStartupScript(this.GetType(), this.ClientID, string.Concat("Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args){for(var panelId in sender._updatePanelClientIDs){if(sender._updatePanelClientIDs[panelId] == '", this.ClientID, "'){", this.OnUpdateCompleteClientScript, "}}});"), true);
    }
}

다음과 같이 사용하십시오.

<uc:UpdatePanel OnUpdateCompleteClientScript="alert('update complete');">
    <!-- stuff in here -->
</uc:UpdatePanel>

물론 이와 같이 사용하려면 webconfig 또는 페이지에서 사용자 지정 컨트롤을 등록해야합니다.

편집 : 또한 jquery.live 를 보셨습니까?

---

UpdatePanel이로드되기 전과 후에 특정 작업을 수행하려는 경우 다음 BeginPostbackRequest과 EndPostbackRequest같이 재정의 할 수 있습니다 .

var postbackControl = null;
var updatePanels = null;
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginPostbackRequest);
prm.add_endRequest(EndPostbackRequest);

function BeginPostbackRequest(sender, args) {
    prm._scrollPosition = null;
    postbackControl = args.get_postBackElement();
    postbackControl.disabled = true;
    updatePanels = args._updatePanelsToUpdate;
    // do your stuff
}

function EndPostbackRequest(sender, args) {
    // do your stuff
    postbackControl.disabled = false;
    postbackControl = null;
    updatePanels = null;
}

This is very handy if you want to process only HTML that was delivered by the update panel. Some operations require more resources and it would be overkill to process the whole DOM tree on pageLoad.

---

Use pageLoaded event and check whether callback or postback:

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(function (sender, args) {
    if (args._panelsUpdated && args._panelsUpdated.length > 0) {
        //callback;
    }
    else {
        //postback;
    }
});

참고URL : https://stackoverflow.com/questions/1152946/how-to-have-a-javascript-callback-executed-after-an-update-panel-postback