이전 섹션에서는 Datagrid를 사용하여 모든 제품 정보를 표시했습니다. 이 섹션에서는 추가, 업데이트, 삭제 및 쿼리의 여러 기능을 추가하기 시작했습니다. 먼저 프론트 데스크에서 디스플레이를 구현 한 다음 배경을 수행하여 데이터를 얻습니다.
1. 기능 추가, 업데이트, 삭제 및 쿼리의 전경 구현 기능
DataGrid Control에는 도구 모음을 추가하는 도구 모음 속성이 있습니다. 이 버튼을 도구 모음 속성에 추가하여 해당 기능을 달성 할 수 있습니다. 먼저 공식 문서의 도구 모음 정의를 살펴 보겠습니다.
배열을 사용하여 도구 모음을 정의하고 다음 코드를 query.jsp 페이지에 추가합니다.
<%@ page language = "java"import = "java.util.*"pageencoding = "utf-8"%> <! doctype html public "-// w3c // dtd html 4.01 transitional // en"> <html> <head> <%@ public/head. 마진 : 1px; } .searchbox {마진 : -3; } </style> <script type = "text/javaScript"> $ (function () {$ ( '#dg'). DataGrid ({// 범주 조치 URL을 요청하기 위해 URL 주소를 변경 : 'category_QueryJoinAccount.Accive.Action', SingleSelect : false, // 모든 함수가 허용됩니다. 기본값은 5, // 사용자 선택에 대한 페이지 당 선택 사항 수를 설정하고, 기본값은 10,20,30,40 ... [5,10,15,20], Idfield : // ID를 식별 필드로 지정하면이 필드를 삭제할 때 유용합니다. page/***************************************/ toolbar: [{ iconCls: 'icon-add', text:'Add category', handler: function(){ alert('--add category--'); } },'-',{ iconCls: 'icon-edit', text:'Update category', handler: function(){ alert('--update 범주-');}},'-', {iconcls :'icon-remove ','icon-remove ', text :'category ', handler : handler : handler : handler : // 선택한 행 레코드가 있는지 여부를 판단하고 선택한 행을 사용하여 선택한 모든 행을 가져옵니다. var rows = $ ( "#dg"). // 선택한 행을 반환하고 행이 선택되지 않은 경우 빈 배열을 반환하면 (rows.length == 0) {// 프롬프트 메시지를 팝업하십시오. } else {// 삭제 확인 여부를 프롬프트합니다. 확인되면 삭제 $ .messager.confirm ( '삭제 확인 대화 상자', '이 항목을 삭제 하려는가?', function (r) {if (r) {if (r) {exit; alert ( "-삭제-"}}); }}}}, '-', {// 쿼리 버튼은 linkbutton이 아니며 구문이 있지만 HTML 태그 텍스트를 구문 분석하는 것도 지원합니다. "<input id = 'ss'ss 'ss'ss 'ss'ss 'ss'ss ' />"}], // Query 텍스트 상자로 변환 ('#ss '). Searcher : 함수 (값, 이름) {// 값은 입력 된 값을 나타냅니다. / ***********************************************************************/}); </script> </head> <hod> <table id = "dg"> </table> </body> </html>이런 식으로, 우리는 추가, 업데이트, 삭제 및 쿼리를위한 전경 프레임 워크를 설정했습니다. 이제 전경에 표시 할 수 있습니다. 백그라운드에 데이터가 나오지 않고 프롬프트 상자 만 팝업되지만 디스플레이 기능이 완료되었습니다. 효과를 살펴 보겠습니다.
다음으로 해당 기능을 하나씩 완료합니다.
2. DataGrid 카테고리 쿼리 구현
쿼리 구현이 가장 간단합니다. 검색 상자에 키워드를 입력 한 다음 키워드를 액션에 매개 변수로 전달 한 다음 서비스는 데이터베이스에서 데이터를 가져와 JSON 형식으로 패키지하고 프론트 데스크로 전달하여 디스플레이를 표시합니다. 이 프로세스는 이전에 표시된 제품 정보와 동일합니다. 위의 JSP에서 검색 부분에 대한 코드를 추가하면 다른 코드를 변경할 필요가 없습니다. 추가 된 코드는 다음과 같습니다.
// 일반 텍스트 상자를 쿼리 검색 텍스트 상자로 변환합니다. $ ( '#ss'). 검색 상자 ({// 쿼리 이벤트 검색기 트리거 : 함수 (value, name) {// 값은 입력 값을 나타냅니다. // alert (value + "," + name) // 현재 쿼리의 키워드를로드하고 DataGRID에로드를 표시합니다. 'QueryParams'속성을 대체하면이 메소드를 호출하여 쿼리를 실행할 수 있습니다.로드 방법은 첫 페이지의 모든 행을로드 할 수 있습니다. 매개 변수가 있습니다. 지정된 경우 QueryParams를 가져옵니다. 그렇지 않으면 위의 QueryParams에 의해 지정된 매개 변수는 기본적으로 전달됩니다. 여기서 우리는 유형을 값 값, 즉 사용자가 입력 한 쿼리 키워드로 설정 한 다음이를 조치로 전달합니다. 배경은 사용자가 입력 한 값을 기반으로 데이터베이스의 검색을 검색하여 전경으로 반환합니다. 실행 결과는 다음과 같습니다.
이런 식으로 검색 기능을 완료했습니다. 이는 비교적 간단합니다.
3. Datagrid 범주 삭제 구현
이제 삭제 함수를 구현하겠습니다. 위의 JSP에서 삭제하기 전에 사용자가 레코드를 선택했는지 여부를 확인할 수 있습니다. 그렇지 않은 경우 사용자에게 프롬프트를 제공합니다. 선택한 경우 팝업 창을 사용하면 사용자가 확인할 수 있습니다. 사실이라면 삭제 함수가 실행됩니다. 주목할 세부 사항이 있습니다. 한 번에 여러 레코드를 삭제하려면 위의 단일 셀렉트 속성을 False로 설정해야합니다.
먼저 위의 query.jsp에서 삭제 된 코드를 보완했습니다. 아래를 참조하십시오.
{iconcls : 'icon-remove', text : 'category', handler : handler : function () {// 선택한 행 레코드가 있는지 판단하고, getSelection을 사용하여 선택한 모든 행을 가져 오기 위해 var rows = $ ( "#dg"). DataGrid ( "getStections"); // 선택한 행을 반환하고 행이 선택되지 않은 경우 빈 배열을 반환하면 (rows.length == 0) {// 프롬프트 메시지를 팝업하십시오. } else {// 삭제 확인 여부를 프롬프트합니다. 확인되면 삭제 논리가 $ .messager.confirm ( '삭제 확인 대화 상자', '이 항목을 삭제 하려는가?', function (r) {if (r) {// 1. 획득 된 레코드에서 해당 ID를 얻은 다음 배경 1,2,3,4 VAR IDS를 보냅니다. ++) {ids += ids = ids.substr (ids.lastindexof ( ","); 후속 업데이트 $ ( "#dg"). DataGrid ( "uncheckall"); // 쿼리를 사용하면 첫 페이지를 새로 고침하고 현재 페이지를 새로 고침하고있다. MSG : '삭제 실패, 작업을 확인하십시오.', 2000, '슬라이드',}); }}}}}}}} 사용자가 삭제하기로 선택하면 먼저 대화 상자가 나타납니다. 사용자가 삭제하려고한다고 결정하면 먼저 사용자가 선택한 제품의 ID를 얻고이 ID를 문자열로 연결 한 다음 AJAX 요청을 백그라운드로 보내야합니다. $ .post의 첫 번째 매개 변수는 해당 동작으로 전송되고, 두 번째 매개 변수는 전송 매개 변수이며, 세 번째 매개 변수는 콜백 함수, 즉 삭제가 성공한 후에 함수의 메소드가 실행됩니다. 함수의 매개 변수 결과는 배경에서 전송되며 네 번째 매개 변수는 선택 사항이며 이는 리턴 데이터 유형입니다. $ .post의 컨텐츠에 중점을 두겠습니다. 배경이 "true"를 반환하여 삭제가 성공했음을 나타내는 경우 DataGrid의 Reload 메소드를 호출하여 페이지를 새로 고칩니다. 다시로드는 이전 쿼리에 사용 된 하중과 동일합니다. 차이점은 새로 고침 후 현재 페이지에 다시로드가 유지되고로드는 첫 페이지를 표시한다는 것입니다.
자, 프론트 엔드 페이지 부분이 작성되었습니다. 다음으로 백그라운드에서 해당 방법을 완료하십시오. 먼저 카테고리 서비스에 deletebyids 메소드를 추가하고 구현 클래스 카테고리에서 메소드를 구현하십시오.
// CategoryService 인터페이스 공용 인터페이스 범주를 확장하여 BaseService <범주> {// 쿼리 카테고리 정보, 캐스케이드 관리자 공개 목록 <Cat // 카테고리의 이름 쿼리 // 키워드를 기반으로 총 레코드 수를 쿼리합니다. public long getCount (문자열 유형); // IDS를 기반으로 여러 레코드를 삭제 공개 void DeleteByIds (String IDS); } // categoryServiceImpl 구현 클래스 @SuppressWarnings ( "Checked") @Service ( "CategoryService") public clateserviceimpl은 baseServiceImpl <category> categoryService를 구현하고 다른 방법으로 서면으로 작성할 수 있습니다. = "C.Id in (" + ids + ")" "범주 C에서 삭제;"; getsession (). Createquery (HQL) .ExecuteUpdate (); }} 서비스 부품을 작성한 후에는 액션 파트를 작성하기 시작합니다. 우리는 프론트 데스크에서 IDS 데이터를 전송하기를 원하기 때문에이 데이터를 수신하기위한 GET 및 설정 방법을 구현하는 작업에는 변수가 있어야합니다. 또한 결과를 프론트 데스크로 전달해야합니다. 이전 장에서 계단식 쿼리를 수행 할 때 사용 된 방법은 쿼리 결과 데이터를 JSON 형식으로 패키지하여 프론트 데스크로 전달하는 것이므로 맵이 필요하고 맵이 구성 파일을 통해 JSON 형식으로 변환됩니다. 여기서 우리가 프론트 데스크로 전달하는 데이터는 비교적 간단합니다. 주식을 성공적으로 삭제하면 "True"를 전달하여 JSON 형식으로 패키지 할 필요가 없습니다. 스트리밍을 통해 전송합니다. 원칙은 이전과 동일합니다. 총리, 우리는 "true"바이트를 저장하기 위해 스트림 객체가 있어야하고 구성을 통해 객체가 프론트 데스크로 스트리밍됩니다. 우리는 여전히이 두 객체를 Baseection에 다음과 같이 씁니다.
@controller ( "Baseeaction") @scope ( "프로토 타입") 공개 클래스 Baseaction <T>는 ActionSupport empless RequestAware, SessionAware, ApplicationAware, ModelDriven <T> {// IDS를 삭제할 수 있으므로 스트림을 사용하여 데이터를 반환하는 데 사용되어야합니다. 이 데이터는 Struts에 의해 얻은 다음 스트림 형태를 통해 전경으로 전송되므로 보호 된 문자열 ID에 Get 메소드를 구현하십시오. 보호 된 입력 스트림 입력 스트림; // 아래에서 생략 ...} 카테고리 actional의 해당 방법은 다음과 같습니다.
@Controller ( "CategoryAction") @Scope ( "프로토 타입") public class categoryAction은 BASEEACTION <범주> {public String QueryJoinAccount () {// avittion ...} public String deleteByIds () {system.out.println (ids); CategoryService.DeleteByIds (IDS); // 삭제가 성공하면 아래쪽으로 실행됩니다. 스트림 inputStream = new BytearRayinputStream ( "true".getBytes ())의 형태로 "true"를 전경으로 전달합니다. // "true"의 바이트를 스트림에 저장 inputStream return "stream"; }} 다음으로 struts.xml의 해당 구성을 살펴 보겠습니다.
<struts> <constant name = "struts.devmode"value = "true"/> <packue name = "shop"extends = "json-default"> <!-Jason-Default Struts-default-> <global-results> <result name = "aindex">/web-inf/main/aindexsp </result> <! 스프링 관리에 전달되기 때문에-<action name = "car 불가능한 데이터-> </result> </action> <action name = "ac name = "send">/web-inf/{1}/{2} .jsp </resent> </action> </package> </struts>이런 식으로, 우리는 삭제 작업을 수행하고 효과를 참조하십시오.
테스트가 성공하면 한 번에 여러 항목을 선택할 수도 있습니다. 이 시점에서 삭제 함수가 완료됩니다.
원래 주소 : http://blog.csdn.net/eson_15/article/details/51338991
위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.