版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xiaozaq/article/details/85757959
日期:2019-01-04
版本:v2.0.2
1.新增requestDataType配置。
对PHP更友好,之前复杂查询请求数据格式是方便java后台获取数据,用的数组模式。
可以通过配置requestDataType,使用json字符串提交请求数据,方便PHP后台接收。
2.新增查询条件无弹窗模式。
不用弹窗窗口填写查询条件,与传统UI类似,直接在界面上填写查询条件。
版本向前兼容。高版本可以直接替换低版本对之前的代码没有任何影响。
按查询条件是否弹窗分为:弹窗/无弹窗 模式
按查询条件是否复杂分为:简单/复杂 模式
具体使用组合就有四种模式。系统可以选择合适的使用。他们互相切换起来也比较简单。可以体验下demo
简单 无弹窗模式:该模式与传统的查询条件UI最接近。可以在不改后台代码情况下替换成改模式。
复杂 无弹窗模式:个人比较推荐使用该模式。需要后台编写相应逻辑配合使用。
1.requestDataType配置示例:
var dc = dynamicCondition.create({
//通过容器选择器传入,也可以$("#dynamicCondition"),或者document.getElementById("dynamicCondition")
elem:"#dynamicCondition"
,tableId:"listTableId"
,conditionTextId:"#msg"
//PHP后台则添加该配置,后台可以通过$_POST['jsonStr'] 获取查询参数json字符串。然后转为数组。
,requestDataType: "json"
})
2.传统的查询功能可以替换为简单查询,无弹窗模式。
不需要修改后台代码,只需要按照dynamicCondition组件配置好查询条件。
dynamicCondition查询条件支持扩展,之前能实现的编辑器,都只可以扩展。如下拉框联动,下拉树,单选组,复选框等等。
简单查询无弹窗模式demo。
配置无弹窗模式有2中方法:
1.调用dynamicCondition.create时配置。
扫描二维码关注公众号,回复:
4927500 查看本文章
var dcInstance = dynamicCondition.create({fields : "#dcDemo"
//,tableId:"listTable"
,conditionTextId:"#msg" //unpopup模式必须配置conditionTextId
,displayModel : 'unpopup' //默认为popup。无弹窗模式请配置unpopup
...
});
2.通过dcInstance.setDisplayModel('unpopup')配置。注意之前必须配置conditionTextId。
注意:使用无弹窗模式必须调用dc.setCondition配置初始条件。否则初始条件为0,之后无法添加条件
体验地址:带后台的查询demo