<!-- 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.Windows.Forms.AxHost+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. mybatis标签之——<trim>

    trim标记是一个格式化的标记,主要用于拼接sql的条件语句(前缀或后缀的添加或忽略),可以完成set或者是where标记的功能. trim属性主要有以下四个  prefix:前缀覆盖并增加其内容   ...

  2. 告别.NET生成报表统计图的烦恼

    告别.NET生成报表统计图的烦恼 标签: 报表.netstatistics图形数据库文档 2009-10-09 12:00 635人阅读 评论(0) 收藏 举报  分类: .net程序设计(C#)(2 ...

  3. Java——String类

    body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...

  4. LeetCode OJ:Insert Interval

    Given a set of non-overlapping intervals, insert a new interval into the intervals (merge if necessa ...

  5. >CH07-cubemap

    使用rendermonkey进行一个天空球的贴图,内容来自<<shaders for gpa>> 不知道是不是用的182版RM的原因,照着书上做一个天空球的CUBEMAP,老不 ...

  6. Numpy 函数总结 (不断更新)

    本篇主要收集一些平时见到的 Numpy 函数. numpy.random.seed & numpy.random.RandomState np.random.seed() 和 np.rando ...

  7. SharePoint 2013的100个新功能之内容管理(三)

    一:视频中的人 作为视频内容类型的一部分,一个新的栏"视频中的人"被加入到其中,可以指定视频中的人,作为视频的元数据.当你编辑视频属性时可以查看到该栏.更多信息 二:重建索引 一个 ...

  8. 关于Behold the Kickmen (球员登场)

    音乐:『Boring,Boring——』作者浑厚的男中音响起,伴随着劲爆的动感音乐 非同正式却又无伤大雅的规则:足球场是圆形的,而且四周有反弹围墙 加强操作的一些设定: 踢踢人射门蓄力时,时间会静止, ...

  9. 修改已经创建的docker容器的端口映射

    原始链接:https://stackoverflow.com/questions/19335444/how-do-i-assign-a-port-mapping-to-an-existing-dock ...

  10. get_class

    <?phpclass foo {    function foo()    {    // implements some logic    }    function name()    {  ...