2008-10-28 4 views
2

이것은 아마도 간단한 질문 일 뿐이지 만 페이지 작성 중에 로딩 대화 상자를 제공하기 위해 ASP.NET에서 AJAX 로더를 가장 효과적으로 사용할 수 있습니까?페이지 렌더링 중 Ajax 로더 표시

현재 ProgressTemplate에 로딩 메시지와 gif가 포함 된 UpdateProgressPanel과 연결된 UpdatePanel이 있습니다.

현재 onLoad()가 비즈니스 엔티티를 가져 와서 표시하는 페이지가 있습니다. 이 작업을 수행하는 동안 AJAX 로더를 표시하고 싶습니다.

페이지로드에 아무 것도없고 onLoadComplete 또는 unLoad()가 트리거 된 숨겨진 단추가있는 것이 좋습니다. 그러면 단추 클릭 메서드가 UpdateProgressPanel을 표시하기를 기다릴 것입니까?

답변

0

저는 Timer 컨트롤과 비슷한 것을했습니다. OnLoad가 타이머를 켜기 만하면 페이지가 렌더링을 마칩니다. 그런 다음 타이머 (일부 최소 간격 값 사용)가 더티 작업을 수행하여 진행률 패널을 올바르게 표시합니다. 프로세스의 마지막 단계로 타이머를 끄는 것을 잊지 마십시오.

+1

답변은 항상 예문이어야합니다. – sam

8

.Net 외부에서 HTML로 변환 할 수 있습니다. ---

 
<script language="javascript">
document.getElementById("loading").style.display = "none";
</script>

그래픽 : 당신이처럼 보이는 코드를 가질 수 있습니다 직전, 페이지의 맨 아래에서

 
<div id="loading">
<!-- Animated GIF or other indication that stuff is happening -->
</div>

: 당신의 ASPX 페이지에서 당신은 같은 코드가 페이지 상단에있는 한 제일 먼저 렌더링됩니다. 그런 다음 모든 onLoad 작업이 수행되고 마지막으로 인라인 JavaScript가 페이지의 맨 아래에 있기 때문에 마지막으로 발생합니다.

언로 드 상태에서 버튼을 비활성화하고 해당 자바 스크립트에서도 버튼을 활성화합니다. 이렇게하면 페이지가 준비되기 전에 사용자가 클릭을 행복하게하고 이벤트를 트리거하지 못하게됩니다.

0

미세 조정이 필요한 경우 진행 막대 기반 AJAX 프리 로더를 사용할 수 있습니다. 상태가 변경 될 때마다 완료되도록 구성 할 수 있습니다. 즉 각 상태가 20 % 진행되는 0에서 4 (5 준비 상태)입니다. 하나를 만드는 것은 매우 간단합니다. div 컨테이너에 div을 보유하고 있으며 width은 각 상태에 대해 20 % 단계로 0에서 100 %까지 변합니다. 내면 div (예 : 파란색)에 배경색을 추가하여 진행 상태를 확인하십시오. GMail 나는 그것의 프리 로더를 위해 유사한 접근법을 사용한다고 생각한다.