miniui 查询_js相关:JQueryMiniUI按照时间进行查询的实现方法

js相关:JQueryMiniUI按照时间进行查询的实现方法

发布于 2020-8-9|

复制链接

下面小妖就为大家带来一篇JQueryMiniUI按照时间进行查询的实现方法。小妖觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小妖过来看看吧

考核的事情已经变成了上一年了,当时要做一个图书管理系统,但是当时因为在按照时间进行搜索的时候,无法将前台的数据传递到后台,所以失去了一部分,现在重看,其实也不过尔尔,反而然我有一种只是当时枉然的意味。好了,那么如何将前台的时间数据传递到后台,其实如果是普通的传递倒也是无所谓的,因为有特殊的功能是在搜索的时候实现所以要在加载页面的时候传递数据,jQuery-MINI UI如何实现:

其实我们要要做的事情是将数据显示到表格中,那么我们就要看一开始是如何实现的:

前台千篇一律如此:

```xhtml

序号

图书编号

图书名称

图书类别

适合人群

入库日期

借阅次数

备注

操作

```

上面是我们的表格显示的内容,mini-ui在页面进行加载的时候就会初始化表格所以说在div中我们有一个url属性,也就是告诉我们数据的来源

```xhtml

url="../index?method=listAll"

```

在页面进行加载的时候回调用listAll这个方法,我们进行搜索的时候也会去调用这个方法,但是我们会传递数据到后台那么在js重我们该如何编写,首先我们来看看不需要传递数据到到后台,怎样来加载这个表格

```xhtml

var grid = mini.get("datagrid1");

grid.load();

```

那么我们在点击搜索的时候,是不是要进行传递数据到后台:

```xhtml

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

});

}

```

按照上面我们就可以在后台的listAll中对接收到的数据进行判断,然后显示对应的数据这个地方有一个特点时间的传递并不是按照yyyy-MM-dd这种格式,而是利用时间戳传递到后台,也就是说传递的是一个long类型是数据,我们来看一看后台是怎样进行接收的

```javascript

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然后在后台将时间戳转换成为一定的格式,我们就可以在数据库中户进行搜索了,还有的是sql语句中时间两边是要加上双引号的。

总之,我们利用JQuerymini-ui在进行数据时间数据传递的时候,如果仅仅传递一个时间,那么时间的格式并不是我们想要的那么满意,而且在后台我们要进行各种各样的判断,现在我们传递时间戳会减少一些判断,并且时间的格式也可以很容易的进行转换。

您好,以下是使用 MiniUI 写一个查询数据同列相同数据合并的 JS 代码的示例: ```javascript // 定义数据 var data = [ { name: "张三", age: 20, gender: "男" }, { name: "李四", age: 21, gender: "男" }, { name: "王五", age: 20, gender: "男" }, { name: "赵六", age: 22, gender: "女" }, { name: "田七", age: 21, gender: "女" }, { name: "刘八", age: 20, gender: "男" }, { name: "周九", age: 22, gender: "女" }, ]; // 定义合并函数 function mergeData(data) { var result = []; var temp = {}; for (var i = 0; i < data.length; i++) { var item = data[i]; if (!temp[item.age]) { temp[item.age] = { name: item.name, age: item.age, gender: item.gender }; result.push(temp[item.age]); } else { temp[item.age].name += "," + item.name; } } return result; } // 合并数据 var mergedData = mergeData(data); // 显示数据 var grid = new mini.DataGrid(); grid.setData(mergedData); document.body.appendChild(grid.el); ``` 在上面的代码中,我们先定义了一个数据,包含了姓名、年龄和性别等信息。然后,我们定义了一个合并函数 `mergeData`,用于将同列相同数据进行合并。在这个函数中,我们使用了一个 `temp` 对象来保存已经合并过的数据,遍历原始数据,对于每个数据项,如果其年龄属性在 `temp` 对象中不存在,则将其添加到 `temp` 对象中,并将其添加到结果数组 `result` 中;否则,将当前数据项的姓名属性添加到 `temp` 对象中对应年龄的数据项的姓名属性后面。最后,我们调用 `mergeData` 函数将数据合并,并将结果显示在一个 MiniUI 的 `DataGrid` 中。 希望这个示例能够帮助到您!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值