关注JEECG发展历程 关注最新动态和版本, 记录JEECG成长点滴 更新日志 - 技术支持 - 招聘英才

JEECG最新版本下载 JEECG智能开发平台 - 显著提高开发效率 常见问题 - 入门视频 - 参与开源团队

商务QQ: 69893005、418799587 商务热线(5*8小时): 010-64808099 官方邮箱: jeecgos@163.com

查看: 34420|回复: 10

jeecg3.3版本 弹出框完善

[复制链接]
发表于 2013-9-6 11:16:34 | 显示全部楼层 |阅读模式
本帖最后由 GIN 于 2013-9-17 12:23 编辑

试用了一下,直到3.3,弹出框这块还是不好用。
放心修改,这个会在下一个版本中追加的,不用担心升级!

弹出框目前使用 <t:choose>标签。
主要存在问题:


  • 在一个页面使用多个choose后,弹出后只能回填第一行的控件。
  • “选择”按钮没有样式,很丑。
  • 在一对多页面明细行里弹出没法用。



针对1.可以对t:choose进行改造,目前我自己重构了一份,修复了这个问题,原因是标签生成的方法重名。

另外标签增加了一个属性:inputTextname,把控件和弹出列表中的字段区分开来,支持多个字段与控件的回填。
以前的hiddenName,hiddenid 可以废弃掉不用了。

  <input name="roleid1"  name="roleid1" value="${id}" id="roleid1">
      <input name="roleName1" class="inputxt" value="${roleName }" id="roleName1" readonly="readonly" datatype="*" />
      <t:choose  url="userController.do?roles" name="roleList" icon="icon-search" title="角色列表" inputTextname="roleid1,roleName1" textname="id,roleName" isclear="true"></t:choose>

inputTextname:要回填数据的控件id
textname:弹出列表的字段名

针对2.直接在<t:choose>的方法内icon属性改为icon-search即可。

      <t:choose hiddenName="roleid" hiddenid="id" url="userController.do?roles" name="roleList" icon="icon-search" title="角色列表" textname="roleName" isclear="true"></t:choose>

效果:

QQ截图20130906105158.jpg

针对3.在一对多的页面中的明细行弃用标签,改用js方式,我这里实现了一个通用的Js弹出方法,在crudtools.js中,覆盖到项目中,直接在界面里调用即可,不需要再引入。
  1. /*
  2.         自定义url的弹出
  3.         obj:要填充的控件,可以为多个,以逗号分隔
  4.         name:列表中对应的字段,可以为多个,以逗号分隔(与obj要对应)
  5.         url:弹出页面的Url
  6. */
  7. function popClick(obj,name,url) {
复制代码
在一对多弹出示例:(这里使用demo中的常用插件-一对多模型)

/WebRoot/webpage/jeecg/demo/test/jeecgOrderMain.jsp
改造:

function resetTrNum(tableId) {
                $tbody = $("#"+tableId+"");
                $tbody.find('>tr').each(function(i){
                        $(':input, select', this).each(function(){
                                var $this = $(this), name = $this.attr('name'), val = $this.val();
                                if(name!=null){
                                        if (name.indexOf("#index#") >= 0){
                                                $this.attr("name",name.replace('#index#',i));
                                        }else{
                                                var s = name.indexOf("[");
                                                var e = name.indexOf("]");
                                                var new_name = name.substring(s+1,e);
                                                $this.attr("name",name.replace(new_name,i));
                                        }
                                        //给明细添加弹出框
                                        name = $this.attr('name');
                                        if(name.indexOf("jeecgOrderProductList") >= 0 && name.indexOf("gopProductName") >= 0){
                                                $this.attr("class","searchbox-inputtext");
                                                $this.unbind("click");
                                                $this.bind("click",function(){popClick("jeecgOrderProductList\["+i+"\]\.gopProductName","roleName","userController.do?roles")});
                                        }
                                }
                        });
                });
        }


/WebRoot/webpage/jeecg/demo/test/jeecgOrderProductList.jsp


$(document).ready(function(){            $(".datagrid-toolbar").parent().css("width","auto");
    });

在这段代码之前加上下面这一句:

resetTrNum('add_jeecgOrderProduct_table');


效果:
QQ截图20130906110159.jpg


QQ截图20130906110212.jpg


最后我把包打出来,包括demo的修改,覆盖到项目中可以直接在demo的一对多模型查询效果。
QQ截图20130906110350.jpg

jeecg-v3-simple.zip (31.57 KB, 下载次数: 221)


发表于 2013-9-12 10:14:32 | 显示全部楼层
大牛,不错
发表于 2013-9-12 10:51:59 | 显示全部楼层
GIN一直很热心!
发表于 2013-10-15 06:56:07 | 显示全部楼层
请问一下,我覆盖完,DataGridUrl类显示错误,这个类是调用哪个包里的?
发表于 2013-10-15 12:07:59 | 显示全部楼层
GIN,非常感谢您,帮了我大忙了
发表于 2013-10-15 17:26:42 | 显示全部楼层
难道你比我酷 发表于 2013-10-15 06:56
请问一下,我覆盖完,DataGridUrl类显示错误,这个类是调用哪个包里的?

方法一(没试过):直接把DataGridUrl 改为DateGridUrl
方法二:
解包org.jeecgframework.tag-sources-3.3.2.jar 覆盖到你的项目中,然后你可以选择把
/jeecg-v3-simple/src/org/jeecgframework/tag/vo/easyui/DateGridColumn.java和
/jeecg-v3-simple/src/org/jeecgframework/tag/vo/easyui/DateGridUrl.java中的
类名Datexxxx改为Dataxxx 就可以了 不知道这里是不是个笔误.......
 楼主| 发表于 2013-10-23 16:49:19 | 显示全部楼层
不好意思 tag的3.2发布后 类名做了更改

Date... 改为了 Data...
发表于 2015-2-28 01:48:25 | 显示全部楼层
顶你!!帮了我大忙了!!!谢谢!!
发表于 2015-11-18 12:10:52 | 显示全部楼层
GIN 发表于 2013-10-23 16:49
不好意思 tag的3.2发布后 类名做了更改

Date... 改为了 Data...

jeecg弹出框显示带多选框的list如何让多选框实现单选;
如:
<html>
<head>
<meta http-equiv="content-Type" content="text/html;charset=gb2312">
<title>多选框特效</title>
<script>
function chewww_zzjs_netValidate(cb) {
for (j = 0; j < 8; j++) {
if (eval("document.zzjs_net.www_zzjs_net[" + j + "].checked") == true) {
document.zzjs_net.www_zzjs_net[j].checked = false;
if (j == cb) {
document.zzjs_net.www_zzjs_net[j].checked = true;
}
}
}

</script>
</head>
<body>

<form name="zzjs_net">
<div align="center">选框 1
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(0)">
<br>
选框 2
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(1)">
<br>
选框 3
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(2)">
<br>
选框 4
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(3)">
<br>
选框 5
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(4)">
<br>
选框 6
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(5)">
<br>
选框 7
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(6)">
<br>
选框 8
<input type="checkBox" name="www_zzjs_net" onClick="javascript:chewww_zzjs_netValidate(7)">
</div>
</form>
</body>
</html>
发表于 2016-10-10 10:47:24 | 显示全部楼层
请教一下,jeecg快速开发平台的弹出框都是蓝色的吗?不会随着主题改变变换吗?
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表