dynamicCondition组件升级为2.0.2版本——版本向前兼容


日期: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时配置。

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值