6 데이터 격자 검색 기능

이 튜 토리 얼 에 서 는 데이터베이스 에서 데 이 터 를 가 져 오고 표시 하 는 데이터 격자 에 표시 합 니 다.먼저 사례 는 검색 상 자 를 정의 하고 입력 한 내용 에 따라 데이터 베 이 스 를 가 져 옵 니 다.
이 어 '5 데이터 그리드 는 페이지 기능 이 있 습 니 다' 는 데이터 그리드 에 검색 도구 막대 가 추가 되 어야 합 니 다.
datagridgetdata. html 표 에 다음 코드 를 추가 합 니 다:

<div id="tb">
	<span>   ：</span>
	<input id="name">
	<a href="#" class="easyui-linkbutton" plain="true" onclick="doSearch()">  </a>
</div>

링크 탭 은 class = "easyui - linktbutton" 스타일 을 사 용 했 습 니 다. 이 지식 에 대해 서 는 다음 과 같이 볼 수 있 습 니 다.
 http://blog.csdn.net/gdhyyanglang/article/details/8293784
테스트 가 실 행 됩 니 다. 새로 추 가 된 검색 도구 막대 가 데이터 격자 아래 에 나타 나 는 것 을 볼 수 있 습 니 다.현재 데이터 격자 의 toolbar 속성 을 사용 하면 도구 막대 기 를 데이터 격자 에 쉽게 통합 할 수 있 습 니 다.데이터 격자 에 toolbar 속성 추가:
toolbar="#tb"
이렇게 되면 검색 도구 막대 가 데이터 격자 와 통합 되 어 간단 하 죠?
사용자 가 input 상자 에 내용 을 입력 하면 검색 을 클릭 하면 onclick 이벤트 가 발생 하여 doSearch 방법 을 실행 합 니 다.

function doSearch(){  
    $('#tt').datagrid('load',{  
        name: $('#name').val(), //         ，     url     
    });  
}

검색 을 누 르 면 name 인 자 를 서버 에 전달 합 니 다.데이터 격자 에서 요청 한 데이터 (url) 를 동시에 다시 불 러 옵 니 다.
datagrid 수정getdata. jsp 코드:

……
//        
String name = "";
if(request.getParameter("name") != null){
	name = 	request.getParameter("name");
}
//       
String where = "name like '" + name + "%'";  
……
ResultSet rset = stmt.executeQuery("select * from " + tableName + " where " + where); 
while(rset.next()) { 
  rows++; 
}

//        
String sql="select * from " + tableName + " where " +  where + " limit " + offset + ", " + datagridRows;
……

파란색 은 새로 추 가 된 코드 로 현재 검색 기능 이 정상적으로 작 동 합 니 다.