본문 바로가기

Windows Developer/Asp.net

[asp.net] GridView 클릭 이벤트 만들기




1.그리드뷰에 클릭 이벤트 함수가 없어서 구글링으로 찾아낸 방식이다. onRowCreated함수를 사용해서 생성되는 Row에 onclick 함수를 만들어 준다. GrdXrayResult_RowCreated함수를 보자.






 

2.m_iRowIdx변수는 전역으로 선언되어 있다. Row의 인덱스가 될 변수이다. onclick 이벤트 속성을 주고 이벤트 이름은 onGridViewRowSelected()가 되겠다.







3.비하인드에서 이벤트 속성을 만들어 줌으로 인해서 div에서 onclick이벤트 함수가 클릭시 호출이 된다. 그럼 마지막으로 onGridViewRowSelected() 함수를 살펴보자.



 
           var gridViewCtlId = '<%=GrdXrayResult.ClientID%>';
           var gridViewCtl = null;
           var curSelRow = null;

 

 onGridViewRowSelected() 함수를 다음과 같이 정의하면 선택된 셀이 클릭된다.




클릭된 row의 특정 column값을 가져오고 싶다면 다음과 같이 하면 된다.




getCellValue(rowidx, 출력하고 싶은 컬럼 인덱스) 함수를 보면 해당 row의 인덱스를 얻어온 후에 
.cells[]로 값을 리턴받아 해당 내용을 출력한다. 출력하기 위해 .innerText 속성을 사용한다.

'<%=변수명%>'은 비하인드 코드에 있는 전역변수다. 이런 방식으로 비하인드의 전역 변수를 사용할 수 있다. "\r\n"은 개행을 하기 위해서 추가 시켰다.





GridView가 하나 이상의 경우 이벤트 함수를 어떻게 변경해야 할까? 어떤 GirdView인지 구별할 수 있는 변수 하나만 더 넘겨주면 된다. 다음 그림을 보자



iViewPos는 해당 GridView의 index이다 인덱스를 다음과 같이 이벤트 함수 2번째 파라미터로 넘겨준다면 어떤 그리드뷰 인지 구별할 수 있게 된다. 다음은 자바스크립트 함수다.

           var gridViewCtlId = '<%=GrdXrayResult.ClientID%>';
 var gridFinishCtlId = '<%=GrdFinish.ClientID%>';
 var gridOcsDelayCtlId = 
'<%=GrdOcsDelay.ClientID%>';
           var gridViewCtl = null;
           var curSelRow = null;
 



onGridViewRowSelected함수가 2개의 파라미터를 받는다. 파라미터를 2개를 받게되면서 getGridViewContorol함수에서 어떤 그리드뷰인지 파악하고 해당 그리드뷰 객체를 대입받게 된다.