JavaScript 확인 ​​대화 상자 -Asp.net

Question

같은 주제에 대해 비슷한 질문을 보았지만 그중 어느 누구도 내 문제를 다루지 않았습니다.

ASP.NET 웹 사이트가 있으며 데이터베이스가 업데이트 된 후 사용자에게 상태 메시지 (ASP : 5 초 안에 사라질 레이블)를 표시하려고합니다.

텍스트를 레이블에 할당 한 다음 JavaScript로 숨기고 싶습니다.

JS 파트를 분류했습니다. 유일한 문제는 텍스트를 컨트롤에 할당 한 후 JS 기능을 호출하려면 어떻게해야합니까?

다음 코드로 데이터베이스에서 무언가를 업데이트한다고 가정 해 봅시다.

<asp:Button ID="btnUploadFiles" runat="server" OnClick="buttonSubmit_Click" Text="Update"  />

뒤에 코드

protected void buttonSubmit_Click(object sender, EventArgs e)
    { try{// update the database  
          // change label text to tell the user update succeeded}
      catch(Exception ex){...}
    }

도와주세요!

업데이트 : jQuery 제발, 평범한 JavaScript

Answer 1

"텍스트를 컨트롤에 할당 한 후 JS 기능을 어떻게 호출합니까?" 버튼 클릭 이벤트 내부의 'RegisterClientscriptBlock'에 호출을 추가하여 Luke가 제공 한 JavaScript를 출력 할 수 있습니다.

protected void buttonSubmit_Click(object sender, EventArgs e)
{ 
    try
    {
       // update the database  
       // change label text to tell the user update succeeded
       label.Text = "Message";
       string js = "function hideLabel(){document.getElementById('" + label.ClientID + "').style.display = 'none'};setTimeout(hideLabel, 5000);"
       ClientScript.RegisterClientScriptBlock(this.GetType(), "test", js ,true);
    }
    catch(Exception ex){...}
}

Answer 2

나는 개인적으로 사용할 것입니다 jQuery 이를 위해서는 평범한 오래된 JavaScript를 사용하려면 이와 같은 것이 트릭을 수행 할 것입니다.

<script type="text/javascript">
function hideLabel()
{
    // replace yourLabelID with <%=YourLabelID.ClientID%> if it's a .NET Label control
    document.getElementById('yourLabelID').style.display = 'none';
}
setTimeout('hideLabel()', 5000);
</script>

필요한 경우 스크립트 블록을 Literal 레이블 텍스트를 업데이트 할 때만 표시하고 볼만하십시오.

Answer 3

Ajax 또는 일반 포스트 백을 통해 다시 게시하고 있습니까? 일반적인 포스트 백인 경우 타이머를 설정하고 타이머가 만료 된 후 레이블을 숨기는 기능을 호출하는 페이지에 JavaScript를 등록하십시오. 다음 예제는 jQuery를 사용하여 타이머가 시작되기 전에 DOM이로드되도록하지만 다른 방법이 있습니다. 5S가 경과 한 후에 라벨을 숨 깁니다.

function hideLabel(label)
{
   $(label).hide();
}

$(document).ready( function() {
    var label = $('#labelID');
    setTimer(function() { hideLabel(label); ),5000);
});

Ajax를 사용하는 경우 아이디어는 기본적으로 동일합니다. 문서로드 대신 Ajax 호출을 위해 Onsuccess 콜백에서 타이머를 설정하는 것을 제외하고는 아이디어가 동일합니다.