jeecg中的原生态组件

时间:2022-09-29 21:13:14

<!-- ztree -->
<link rel="stylesheet" type="text/css" href="plug-in/ztree/css/zTreeStyle.css"></link>
<script type="text/javascript" src="plug-in/ztree/js/jquery.ztree.core-3.5.min.js" ></script>
<script type="text/javascript" src="plug-in/ztree/js/jquery.ztree.excheck-3.5.min.js"></script>

<!-- 文件上传 -->
<link rel="stylesheet" type="text/css" href="plug-in/webuploader/webuploader.css"></link>
<script type="text/javascript" src="plug-in/webuploader/webuploader.min.js" ></script>

<!-- 自动补全 -->
<link rel="stylesheet" href="plug-in/jquery/jquery-autocomplete/jquery.autocomplete.css" type="text/css"></link>
<script type="text/javascript" src="plug-in/jquery/jquery-autocomplete/jquery.autocomplete.min.js"></script>

<!-- 联动 -->
<script src="plug-in/jquery/jquery.regionselect.js" type="text/javascript"></script>

<fieldset>
<legend>文件上传</legend>
<div id="uploader" class="wu-example">
<!--用来存放文件信息-->
<div id="thelist" class="uploader-list"></div>
<div class="btns">
<div id="picker">选择文件</div>
</div>
</div>
</fieldset>

<fieldset>
<legend>autocomplete</legend>
<table>
<tr>
<td style="width:90px;text-align: right;">用户名自动补全:</td>
<td>
<input type="text" id="userNameAuto" name="userName" class="ac_input">
</td>
</tr>
</table>
</fieldset>

<fieldset>
<legend>联动下拉省市区</legend>
<!-- update-begin_author:taoYan date:20170803 for:修复ie下样式变乱 -->
<div style="width:80%;margin:5px 0 0 10px;">
<input type="text" id="province" style="width:32%;" value=""/>
<input type="text" id="city" style="width:32%;" value=""/>
<input type="text" id="area" style="width:32%;" value=""/>
</div>
</fieldset>

<fieldset>
<legend>ztree</legend>
<div style="clear:both"></div>
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree"></ul>
</div>
</fieldset>
<!-- update-end-author:taoYan date:20170803 for:修复ie下样式变乱 -->

<fieldset>
<legend>ueditor</legend>
<table>
<tr>
<!-- <td align="right"><label class="Validform_label">demo:</label> -->
<td>
<script type="text/javascript" charset="utf-8" src="plug-in/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="plug-in/ueditor/ueditor.all.min.js"></script>
<textarea name="ueditorContent" id="ueditorContent" style="width: 650px;"></textarea>
<script type="text/javascript">
var editor = UE.getEditor('ueditorContent');
</script>
<span class="Validform_checktip"></span>
</td>
</tr>
</table>
</fieldset>
</t:formvalid>
<!-- update-end--Author:yugwu Date:20170626 for:[TASK #2135]【浏览器兼容问题】IE8下样式乱了-------------------- -->

<!-- update-begin--Author:taoYan Date:20170803 for:代码格式修改 -->
<script type="text/javascript">
function printobj(obj){
var str='[';
for(var a in obj){
str+=a+':'+obj[a]+",";
}
str+=0+':0]';
return str;
}
function getTremValueuserName() {
return $("#userNameAuto").val();
}
$(function() {
//ztree
var setting = {
check: {
enable: true
},
view: {
dblClickExpand: true
},
data: {
simpleData: {
enable: true
}
}
};
var zNodes=jQuery.parseJSON('${regions}');
$.fn.zTree.init($("#treeDemo"), setting, zNodes);

//省市区下拉
$("#province").regionselect({
url:'<%=basePath%>/jeecgFormDemoController.do?regionSelect'
});

/*-------------------------------------------文件上传----------------------------------------------*/
var urlc= '<%=basePath%>/systemController/filedeal.do';
var BASE_URL="<%=basePath%>";
var uploader = WebUploader.create({
// swf文件路径
swf: BASE_URL+'/plug-in/webuploader/Uploader.swf',
// 文件接收服务端。
server: urlc,
// 选择文件的按钮。可选。
// 内部根据当前运行是创建,可能是input元素,也可能是flash.
pick: '#picker',
// 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!
resize: false,
//指明参数名称,后台也用这个参数接收文件
duplicate: false,
auto: true,
//每次上传附带参数
formData:{"uparg":"ggfile"}

});
uploader.on( 'fileQueued', function( file ) {
$("#thelist").append( '<div id="' + file.id + '" class="item">' +
'<div class="state">'+file.name+'---等待上传...</div>' +
'</div>' );
});

//文件上传过程中创建进度条实时显示.
uploader.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('div.state').html(file.name+'---上传中');
$percent.css( 'width', percentage * 100 + '%' );
});
uploader.on( 'uploadSuccess', function(file) {
$( '#'+file.id ).find('div.state').html(file.name+'---上传成功!');
});
uploader.on( 'uploadError', function( file) {
$( '#'+file.id ).find('div.state').html(file.name+'---上传出错');
});
uploader.on( 'uploadComplete', function( file ) {
$( '#'+file.id ).find('.progress').fadeOut('slow');
});
/*-------------------------------------------文件上传----------------------------------------------*/

/*-------------------------------------------自动补全----------------------------------------------*/
$("#userNameAuto").autocomplete("jeecgFormDemoController.do?getAutocompleteData", {
max: 5,
minChars: 1,
width: 200,
scrollHeight: 100,
matchContains: true,
autoFill: false,
extraParams: {
featureClass: "P",
style: "full",
maxRows: 10,
labelField: "userName",
valueField: "userName",
searchField: "userName",
entityName: "TSUser",
trem: getTremValueuserName
},
parse: function(data) {
return jeecgAutoParse.call(this, data);
},
formatItem: function(row, i, max) {
return row['userName'];
}
}).result(function(event, row, formatted) {
$("#userNameAuto").val(row['userName']);
});
/*-------------------------------------------自动补全----------------------------------------------*/

$("div.webuploader-container").css("width","78px");

});
</script>
</body>
</html>
<!-- update-end--Author:taoYan Date:20170803 for:代码格式修改 -->

jeecg中的原生态组件的更多相关文章

  1. Bootstrap 中的 Typeahead 组件 -- AutoComplete

    Bootstrap 中的 Typeahead 组件就是通常所说的自动完成 AutoComplete,功能很强大,但是,使用上并不太方便.这里我们将介绍一下这个组件的使用. 第一,简单使用 首先,最简单 ...

  2. WPF中实例化Com组件,调用组件的方法时报System&period;Windows&period;Forms&period;AxHost&plus;InvalidActiveXStateException的异常

    WPF中实例化Com组件,调用组件的方法时报System.Windows.Forms.AxHost+InvalidActiveXStateException的异常 在wpf中封装Com组件时,调用组件 ...

  3. EffectiveJava——请不要在代码中使用原生态类型

    先看一个栗子,看看能不能找出来里面的错误: /** * 请不要在新代码中使用原生态类型 * @author weishiyao * */ public class Test { public stat ...

  4. Titanium中调用ios组件时语言不是本地化的解决方法

    用Titanium开发的ios应用中,当调用系统组件时,尽管手机已经设置了系统语言为中文,但那些组件的界面却仍为英文.比如调用iphone中的相册组件,其界面为: 那么怎么让它跟系统语言保持一致呢? ...

  5. 第30课 Qt中的文本编辑组件

    1. 3种常用的文本编辑组件的比较 单行文本支持 多行文本支持 自定义格式支持 富文本支持 QLineEdit (单行文本编辑组件) Yes No No No QPlainTextEdit (多行普通 ...

  6. ExtJs中xtype与组件类的对应表

    from:http://blog.163.com/jx_dream/blog/static/117056627201223091021410/ 核心提示:我们在使用 ExtJs 创建组件时最容易理解的 ...

  7. 杂谈SharpDx中的WIC组件——我们需要WIC的图片编码功能么?

    在前文 SharpDX之Direct2D教程II——加载位图文件和保存位图文件 中,发现在VB2010中不能很好的运用SharpDx中的WIC组件进行图片的编码工作.可能是我的设置问题,也可能是Sha ...

  8. VC中调用COM组件的方法(转载)

    原文参考:http://hi.baidu.com/mingyueye/item/53ebecd44da76917d80e4449 总结一下在VC中调用COM组件的方法 准备及条件: COM服务器为进程 ...

  9. yii中的自定义组件

    yii中的自定义组件(组件就是一些自定义的公用类) 1.在项目目录中的protected/components/Xxxx.php 2.在Xxxx.php中定义一个类,类名必须与文件名相同 3.控制器中 ...

随机推荐

  1. T-sql语句查询执行顺序

    前言 数据库的查询执行,毋庸置疑是程序员必备技能之一,然而数据库查询执行的过程绚烂多彩,却是很少被人了解,今天哥哥要带你装逼带你飞,深入一下这sql查询的来龙去脉,为查询的性能优化处理打个基础,或许面 ...

  2. 项目中使用RDLC报表

    原文地址:http://www.cnblogs.com/wuhuacong/p/4109833.html RDLC是一个不错的报表,有着比较不错的设计模式和展现效果,在我的Winform开发里面,使用 ...

  3. 模拟 Codeforces Round &num;249 &lpar;Div&period; 2&rpar; C&period; Cardiogram

    题目地址:http://codeforces.com/contest/435/problem/C /* 题意:给一组公式,一组数据,计算得到一系列的坐标点,画出折线图:) 模拟题:蛮恶心的,不过也简单 ...

  4. ActionBar官方教程&lpar;5&rpar;ActionBar的分裂模式&lpar;底部tab样式&rpar;&comma;隐藏标题&comma;隐藏图标

    Using split action bar Split action bar provides a separate bar at the bottom of the screen to displ ...

  5. 【转】android&colon;paddingLeft与android&colon;layout&lowbar;marginLeft的区别

    http://www.blogjava.net/anchor110/articles/342206.html 当按钮分别设置以上两个属性时,得到的效果是不一样的. android:paddingLef ...

  6. bc 命令

    bc命令是一种支持任意精度的交互执行的计算器语言.是Linux简单的计算器,能进行进制转换与计算.能转换的进制包括十六进制.十进制.八进制.二进制等.可以使用的运算符号包括(+)加法.(-)减法.(* ...

  7. 【repost】Javascript操作DOM常用API总结

    Javascript操作DOM常用API总结 文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认 ...

  8. maven实战读书笔记(二)

    一个Spring加载属性的工具类,指定目标位置之后可以用${}的方式加载配置文件 测试maven工程发送email的例子:运行成功的例子—github 常用的命令: mvn clean compile ...

  9. PL&sol;SQL&colon; numeric or value error&colon; character to number conversion error

    在最简单的plsql块编程中出现这个错误,是因为 DBMS_OUTPUT.PUT_LINE('the x is '+x);这里面不能用“+”,而是要用“||” DECLARE x number; ; ...

  10. 为什么要使用docker

    1. 为什么要使用Docker Docker容器虚拟化的好处 Docker项目的发起人和Docker Inc.的CTO Solomon Hykes认为,Docker在正确的地点.正确的时间顺应了正确的 ...