2010-04-29 2 views
0

나는이 라인을 포함하는 <script> 있습니다ASP.NET : JavaScript 객체가 null로 설정된 이유는 무엇입니까?

var tbl = document.getElementById("<%= this.tblSelection.ClientID %>"); 

...하지만 tbl 항상 null로 설정되고 끝납니다.

표는 다음과 같이 선언한다 :

<asp:Table ID="tblSelection" runat="server" CellPadding="2" CellSpacing="0" 
    cols="1" style="position: absolute; top: 0%; right: 0%"> 

스크립트와 테이블 모두 동일한 마스터 페이지 파일에 있습니다.

이 문제의 원인은 무엇일까요?

편집 :이 스크립트는 내가 브라우저가 완전히 테이블을 렌더링 할 수있는 기회를 가지고 전에 자바 스크립트 코드가 실행되는 추측하고 onload

+0

테이블 앞 또는 뒤의 페이지에 스크립트가 있습니까? –

+0

스크립트가 머리 부분에 있고 테이블이 본문에 있습니다. 머리가 먼저 온다. – Giffyguy

답변

3

에서 실행되는 것을 언급해야한다. 이 시점에서 페이지의 DOM은 완료되지 않으며 아직 없기 때문에 getElementByID 함수가 테이블을 찾을 수 없습니다!

이 실험을 수행

<head runat="server"> 
<title></title> 

<script language="javascript"> 

    function showTable() { 

     var tbl = document.getElementById("<%= this.tblSelection.ClientID %>"); 

     alert(tbl); 
    } 

    showTable(); 

</script> 

이는 "널 (null)"할 때 페이지가 처음로드를 표시합니다. 그러나 버튼을 추가하여이 메소드를 다시 호출하면 tbl이 채워지는 것을 볼 수 있습니다.

<input type="button" value="CheckTable" onclick="showTable();" /> 
+0

흠, 알았어. onload 이벤트 핸들러에서 DOM에 액세스하는 방법을 알고 있습니까? 아니면 다른 방법이 있습니까? – Giffyguy

+0

물론입니다. 페이지 본문의 OnLoad 이벤트 처리기는 본문 렌더링 후에 발생하므로 해당 개체를 사용할 수 있습니다. 시도해보십시오 : 다른 옵션은 거의 우아하지 않지만 페이지의 본문 뒤에 Javascript 블록을 넣는 것입니다. – cortijon

1

닉이 정확합니다. 테이블은 아직 파싱/구축되지 않았습니다. getElementById 코드를 document.ready 이벤트로 이동하십시오. BTW, JQuery는 문서 이벤트와 그 이상에 대한 멋진 래퍼를 제공합니다.

$(document).ready(function() 
{ 
    $get('table-id').doManipulation(); 
}); 
+0

document.ready가 작동하지 않는 것 같습니다. 여전히 null입니다. – Giffyguy

+0

MrGumbe 솔루션이 도움이 되었습니까? 그렇다면 아마도 테이블은 업데이트 패널에 배치되거나 문서 준비가 완료된 후에로드됩니다. Btw, JQuery를 설치 했습니까? $ (document) .ready는 JQuery 확장이다. –

1

이 MrGumbe과 발레라가 자바 스크립트의 타이밍에 대한 맞다 : 여기

는 코드입니다. 그러나 나는 이것이 또 다른 이유로 발생하는 것을 보았습니다. 우리는 서버 측 로직이 tblSelection.Visible = false를 설정하는 인스턴스를 가지고 있는데, 이는 브라우저에 출력되지 않는다는 것을 의미합니다. 귀하와 같은 클라이언트 측 코드가 ID와 뱅을 찾습니다.

관련 문제