이 글에서는 주로 시간에 따라 질의하는 JQueryMiniUI의 구현 방법을 소개합니다. 편집자님이 꽤 좋다고 생각하셔서 지금 공유하고 모두에게 참고용으로 드리고자 합니다. 편집자를 따라 살펴보겠습니다. 모두에게 도움이 되기를 바랍니다.
평가 사항이 작년으로 바뀌었어요. 그때 도서관 관리 시스템을 구축하고 싶었는데, 시간에 따라 검색을 했더니 프론트엔드 데이터가 백엔드로 옮겨지지 않아서 졌습니다. 지금 다시 보니 , 사실 아무것도 아니었지만 당시에는 그저 헛된 일이라는 생각이 들었습니다. 자 그럼 프론트에서 시간 데이터를 백그라운드로 어떻게 옮기는 걸까요? 사실 일반 전송이어도 상관은 없습니다. 검색 중에 구현되는 특별한 기능이 있기 때문이죠
그래서 데이터는 페이지가 로드될 때 전송되어야 합니다. , jQuery-MINI UI 구현 방법:
실제로 우리가 원하는 것은 데이터를 테이블에 표시하는 것입니다. 그런 다음 그것이 어떻게 구현되는지 살펴봐야 합니다. 시작:
프런트 데스크는 동일합니다:
<p id="datagrid1" class="mini-datagrid" style="width: 1000px; height: 280px;" url="../index?method=listAll" idField="id" multiSelect="true" sizeList="[5,10,15]" pageSize="10" > <p property="columns"> <p type="checkcolumn"></p> <p type="indexcolumn">序号</p> <p field="bookGuid" width="60" headerAlign="center" allowSort="true">图书编号</p> <p field="bookName" width="60" headerAlign="center" allowSort="true">图书名称</p> <p field="bookType" class="mini-combobox" width="60" renderer="onTypeRenderer">图书类别</p> <p field="suitable" width="60" renderer="onSuitRenderer">适合人群</p> <p field="buyDate" width="150" headerAlign="center" dateFormat="yyyy-MM-dd HH:mm:ss" allowSort="true">入库日期</p> <p field="count" width="60" style="color:red">借阅次数</p> <p field="remark" width="60" style="color:red">备注</p> <p name="action" width="120" headerAlign="center" align="center" renderer="onActionRenderer" cellStyle="padding:0;">操作</p> </p> </p>
위는 페이지가 로드될 때 Mini-ui가 테이블을 초기화하므로 p에 url 속성이 있습니다. , 데이터 소스를 알려줍니다
url="../index?method=listAll"
페이지가 로드될 때 listAll 메소드가 호출됩니다. 검색할 때도 이 메소드를 호출하지만 데이터를 백그라운드로 전달합니다. 먼저, 데이터를 전달할 필요가 없는지 살펴보겠습니다. 백그라운드로 이동하여 이 양식을 로드하는 방법
var grid = mini.get("datagrid1"); grid.load();
function search() { var type1 = mini.get("type1").getValue(); var date1=mini.get("date1").getValue(); var timestamp = Date.parse(date1); grid.load({ type1:type1, timestmp:timestamp }); }
여기에는 시간이 있다는 특징이 있습니다. yyyy-MM-dd 형식으로 전송되지 않고 타임스탬프를 사용하여 백그라운드로 전송됩니다. 즉, 유형이 데이터로 전송된다는 뜻입니다
public void listAll(HttpServletRequest request, HttpServletResponse response) throws Exception{ String type=request.getParameter("type1"); String lstr=request.getParameter("timestmp"); long time=0; if(lstr!=null && isNumeric(lstr)){ time=Long.parseLong(lstr); } Date date1=new Date(); date1.setTime(time); Date date2=new Date(); date2.setTime(time+24*60*60*1000); SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd"); String sql="select * from bookinfo"; if(type!= null && type.length()>0 && time==0) { sql="select * from bookinfo where booktype="+Integer.parseInt(type); } else if(time!=0 && type.length()==0) { sql ="select * from bookinfo where buydate between \""+ sdf.format(date1) +"\" and \""+sdf.format(date2)+"\""; } else if(time!=0 && type.length()>0) { sql ="select * from bookinfo where booktype="+Integer.parseInt(type)+" and buydate between \""+ sdf.format(date1) +"\" and \""+sdf.format(date2)+"\""; } else { sql ="select * from bookinfo"; } System.out.println(sql); //要知道的是联合查询中需要得到的List也是显示出来的 List list=mdao.getList(sql); //实现的是分页 int pageSize=Integer.parseInt(request.getParameter("pageSize")); int pageIndex=Integer.parseInt(request.getParameter("pageIndex")); List sub_list=new ArrayList<>(); int start=pageIndex*pageSize; for(int i=start;i<list.size() && i<start+pageSize;i++) { sub_list.add(list.get(i)); } String json=JsonUtil.listToJson(sub_list, "yyyy-MM-dd hh:mm:ss"); System.out.println(json); json=JsonData.modifyJson(json); json=json.replaceFirst("null", list.size()+""); response.getWriter().write(json); }
간단히 데이터와 시간 데이터를 전송할 때 JQuerymini-ui를 사용합니다. 시간만 전송할 경우 시간 형식이 원하는 만큼 만족스럽지 않고 백그라운드에서 발생합니다. 우리는 다양한 판단을 하기 위해 이제 타임스탬프를 전달하여 일부 판단을 줄이고 시간 형식을 쉽게 변환할 수 있습니다. H 관련 권장 사항: inThinkphp+jquery miniui 개발 관리 시스템
Thinkphp+jquery miniui 개발 관리 시스템, ThinkPhpjqury
jqury miniui 튜토리얼 양식 제어 병합 cell_JQUERY
위 내용은 시간을 기준으로 JQueryMiniUI 쿼리를 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!