Skip to content
GitLab
"vscode:/vscode.git/clone" did not exist on "24c99f45773ea95b715139ac3e130f0437f30c4c"
Commit a67629d0 authored by 季圣华's avatar 季圣华
Browse files

No commit message 

No commit message
parent 6c2a3721
Hide whitespace changes
Inline Side-by-side
WebRoot/js/easyui-1.3.5/demo/tooltip/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Tooltip - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic Tooltip</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Hover the links to display tooltip message.</div>
</div>
<div style="margin:10px 0;"></div>
<p>The tooltip can use each elements title attribute.
<a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a> to display tooltip.
</p>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/tooltip/customcontent.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Tooltip Content - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Tooltip Content</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Access to each elements attribute to get the tooltip content.</div>
</div>
<div style="margin:10px 0;"></div>
<div id="pg" data-options="total:114" style="border:1px solid #ddd;"></div>
<script>
$(function(){
$('#pg').pagination().find('a.l-btn').tooltip({
content: function(){
var cc = $(this).find('span.l-btn-empty').attr('class').split(' ');
var icon = cc[1].split('-')[1];
return icon + ' page';
}
});
});
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/tooltip/customstyle.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Tooltip Style - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Tooltip Style</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to change the tooltip style.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<div id="pp1" class="easyui-panel" style="width:100px;padding:5px">Hover Me</div>
</div>
<div style="padding:10px 200px">
<div id="pp2" class="easyui-panel" style="width:100px;padding:5px">Hover Me</div>
</div>
<script>
$(function(){
$('#pp1').tooltip({
position: 'right',
content: '<span style="color:#fff">This is the tooltip message.</span>',
onShow: function(){
$(this).tooltip('tip').css({
backgroundColor: '#666',
borderColor: '#666'
});
}
});
$('#pp2').tooltip({
position: 'bottom',
content: '<div style="padding:5px;background:#eee;color:#000">This is the tooltip message.</div>',
onShow: function(){
$(this).tooltip('tip').css({
backgroundColor: '#fff000',
borderColor: '#ff0000',
boxShadow: '1px 1px 3px #292929'
});
},
onPosition: function(){
$(this).tooltip('tip').css('left', $(this).offset().left);
$(this).tooltip('arrow').css('left', 20);
}
});
});
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/tooltip/position.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip Position - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip Position</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the drop-down list below to change where the tooltip appears.</div>
</div>
<div style="margin:10px 0;"></div>
<span>Select position:</span>
<select onchange="changePosition(this.value)">
<option value="bottom">Bottom</option>
<option value="top">Top</option>
<option value="left">Left</option>
<option value="right">Right</option>
</select>
<div style="padding:10px 200px">
<div id="pp" class="easyui-panel easyui-tooltip" title="This is the tooltip message." style="width:100px;padding:5px">Hover Me</div>
</div>
<script type="text/javascript">
function changePosition(pos){
$('#pp').tooltip({
position: pos
});
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/tooltip/toolbar.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip as Toolbar - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip as Toolbar</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to create a tooltip style toolbar.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<p><a id="dd" href="javascript:void(0)" class="easyui-tooltip" data-options="
hideEvent: 'none',
content: function(){
return $('#toolbar');
},
onShow: function(){
var t = $(this);
t.tooltip('tip').focus().unbind().bind('blur',function(){
t.tooltip('hide');
});
}
">Hover me</a> to display toolbar.</p>
</div>
<div style="display:none">
<div id="toolbar">
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Add" data-options="iconCls:'icon-add',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Cut" data-options="iconCls:'icon-cut',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Remove" data-options="iconCls:'icon-remove',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Undo" data-options="iconCls:'icon-undo',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Redo" data-options="iconCls:'icon-redo',plain:true"></a>
</div>
</div>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/tooltip/tooltipdialog.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip Dialog - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip Dialog</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to create a tooltip dialog.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<p><a id="dd" href="javascript:void(0)">Click here</a> to see the tooltip dialog.
</div>
<script>
$(function(){
$('#dd').tooltip({
content: $('<div></div>'),
showEvent: 'click',
onUpdate: function(content){
content.panel({
width: 200,
border: false,
title: 'Login',
href: '_dialog.html'
});
},
onShow: function(){
var t = $(this);
t.tooltip('tip').unbind().bind('mouseenter', function(){
t.tooltip('show');
}).bind('mouseleave', function(){
t.tooltip('hide');
});
}
});
});
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/actions.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid Actions - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid Actions</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the buttons below to perform actions.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="collapseAll()">CollapseAll</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="expandAll()">ExpandAll</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="expandTo()">ExpandTo</a>
</div>
<table id="tg" class="easyui-treegrid" title="TreeGrid Actions" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name'
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function collapseAll(){
$('#tg').treegrid('collapseAll');
}
function expandAll(){
$('#tg').treegrid('expandAll');
}
function expandTo(){
$('#tg').treegrid('expandTo',21).treegrid('select',21);
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>TreeGrid allows you to expand or collapse group rows.</div>
</div>
<div style="margin:10px 0;"></div>
<table title="Folder Browser" class="easyui-treegrid" style="width:700px;height:250px"
data-options="
url: 'treegrid_data1.json',
method: 'get',
rownumbers: true,
idField: 'id',
treeField: 'name'
">
<thead>
<tr>
<th data-options="field:'name'" width="220">Name</th>
<th data-options="field:'size'" width="100" align="right">Size</th>
<th data-options="field:'date'" width="150">Modified Date</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/clientpagination.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Client Side Pagination in TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Client Side Pagination in TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to implement client side pagination in TreeGrid.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg" class="easyui-treegrid" title="Client Side Pagination" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
loadFilter: pagerFilter,
pagination: true,
pageSize: 2,
pageList: [2,5,10]
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function pagerFilter(data){
if ($.isArray(data)){ // is array
data = {
total: data.length,
rows: data
}
}
var dg = $(this);
var state = dg.data('treegrid');
var opts = dg.treegrid('options');
var pager = dg.treegrid('getPager');
pager.pagination({
onSelectPage:function(pageNum, pageSize){
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
pager.pagination('refresh',{
pageNumber:pageNum,
pageSize:pageSize
});
dg.treegrid('loadData',data);
}
});
if (!data.topRows){
data.topRows = [];
data.childRows = [];
for(var i=0; i<data.rows.length; i++){
var row = data.rows[i];
row._parentId ? data.childRows.push(row) : data.topRows.push(row);
}
data.total = (data.topRows.length);
}
var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
var end = start + parseInt(opts.pageSize);
data.rows = $.extend(true,[],data.topRows.slice(start, end).concat(data.childRows));
return data;
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/contextmenu.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid ContextMenu - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid ContextMenu</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Right click to display the context menu.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg" class="easyui-treegrid" title="TreeGrid ContextMenu" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
onContextMenu: onContextMenu
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<div id="mm" class="easyui-menu" style="width:120px;">
<div onclick="append()" data-options="iconCls:'icon-add'">Append</div>
<div onclick="removeIt()" data-options="iconCls:'icon-remove'">Remove</div>
<div class="menu-sep"></div>
<div onclick="collapse()">Collapse</div>
<div onclick="expand()">Expand</div>
</div>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function onContextMenu(e,row){
e.preventDefault();
$(this).treegrid('select', row.id);
$('#mm').menu('show',{
left: e.pageX,
top: e.pageY
});
}
var idIndex = 100;
function append(){
idIndex++;
var d1 = new Date();
var d2 = new Date();
d2.setMonth(d2.getMonth()+1);
var node = $('#tg').treegrid('getSelected');
$('#tg').treegrid('append',{
parent: node.id,
data: [{
id: idIndex,
name: 'New Task'+idIndex,
persons: parseInt(Math.random()*10),
begin: $.fn.datebox.defaults.formatter(d1),
end: $.fn.datebox.defaults.formatter(d2),
progress: parseInt(Math.random()*100)
}]
})
}
function removeIt(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('remove', node.id);
}
}
function collapse(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('collapse', node.id);
}
}
function expand(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('expand', node.id);
}
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/editable.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Editable TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Editable TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Select one node and click edit button to perform editing.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="edit()">Edit</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="save()">Save</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="cancel()">Cancel</a>
</div>
<table id="tg" class="easyui-treegrid" title="Editable TreeGrid" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
showFooter: true
">
<thead>
<tr>
<th data-options="field:'name',width:180,editor:'text'">Task Name</th>
<th data-options="field:'persons',width:60,align:'right',editor:'numberbox'">Persons</th>
<th data-options="field:'begin',width:80,editor:'datebox'">Begin Date</th>
<th data-options="field:'end',width:80,editor:'datebox'">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress,editor:'numberbox'">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
var editingId;
function edit(){
if (editingId != undefined){
$('#tg').treegrid('select', editingId);
return;
}
var row = $('#tg').treegrid('getSelected');
if (row){
editingId = row.id
$('#tg').treegrid('beginEdit', editingId);
}
}
function save(){
if (editingId != undefined){
var t = $('#tg');
t.treegrid('endEdit', editingId);
editingId = undefined;
var persons = 0;
var rows = t.treegrid('getChildren');
for(var i=0; i<rows.length; i++){
var p = parseInt(rows[i].persons);
if (!isNaN(p)){
persons += p;
}
}
var frow = t.treegrid('getFooterRows')[0];
frow.persons = persons;
t.treegrid('reloadFooter');
}
}
function cancel(){
if (editingId != undefined){
$('#tg').treegrid('cancelEdit', editingId);
editingId = undefined;
}
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/footer.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid with Footer - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid with Footer</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Show summary information on TreeGrid footer.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg"></table>
<script type="text/javascript">
$(function(){
$('#tg').treegrid({
title:'TreeGrid with Footer',
iconCls:'icon-ok',
width:700,
height:250,
rownumbers: true,
animate:true,
collapsible:true,
fitColumns:true,
url:'treegrid_data2.json',
method: 'get',
idField:'id',
treeField:'name',
showFooter:true,
columns:[[
{title:'Task Name',field:'name',width:180},
{field:'persons',title:'Persons',width:60,align:'right'},
{field:'begin',title:'Begin Date',width:80},
{field:'end',title:'End Date',width:80},
{field:'progress',title:'Progress',width:120,
formatter:function(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
}
]]
});
})
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/reports.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Reports using TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Reports using TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Using TreeGrid to show complex reports.</div>
</div>
<div style="margin:10px 0;"></div>
<table title="Reports using TreeGrid" class="easyui-treegrid" style="width:700px;height:250px"
data-options="
url: 'treegrid_data3.json',
method: 'get',
rownumbers: true,
showFooter: true,
idField: 'id',
treeField: 'region'
">
<thead frozen="true">
<tr>
<th field="region" width="200">Region</th>
</tr>
</thead>
<thead>
<tr>
<th colspan="4">2009</th>
<th colspan="4">2010</th>
</tr>
<tr>
<th field="f1" width="60" align="right">1st qrt.</th>
<th field="f2" width="60" align="right">2st qrt.</th>
<th field="f3" width="60" align="right">3st qrt.</th>
<th field="f4" width="60" align="right">4st qrt.</th>
<th field="f5" width="60" align="right">1st qrt.</th>
<th field="f6" width="60" align="right">2st qrt.</th>
<th field="f7" width="60" align="right">3st qrt.</th>
<th field="f8" width="60" align="right">4st qrt.</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/treegrid_data1.json 0 → 100644
View file @ a67629d0
[{
"id":1,
"name":"C",
"size":"",
"date":"02/19/2010",
"children":[{
"id":2,
"name":"Program Files",
"size":"120 MB",
"date":"03/20/2010",
"children":[{
"id":21,
"name":"Java",
"size":"",
"date":"01/13/2010",
"state":"closed",
"children":[{
"id":211,
"name":"java.exe",
"size":"142 KB",
"date":"01/13/2010"
},{
"id":212,
"name":"jawt.dll",
"size":"5 KB",
"date":"01/13/2010"
}]
},{
"id":22,
"name":"MySQL",
"size":"",
"date":"01/13/2010",
"state":"closed",
"children":[{
"id":221,
"name":"my.ini",
"size":"10 KB",
"date":"02/26/2009"
},{
"id":222,
"name":"my-huge.ini",
"size":"5 KB",
"date":"02/26/2009"
},{
"id":223,
"name":"my-large.ini",
"size":"5 KB",
"date":"02/26/2009"
}]
}]
},{
"id":3,
"name":"eclipse",
"size":"",
"date":"01/20/2010",
"children":[{
"id":31,
"name":"eclipse.exe",
"size":"56 KB",
"date":"05/19/2009"
},{
"id":32,
"name":"eclipse.ini",
"size":"1 KB",
"date":"04/20/2010"
},{
"id":33,
"name":"notice.html",
"size":"7 KB",
"date":"03/17/2005"
}]
}]
}]
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/treegrid/treegrid_data2.json 0 → 100644
View file @ a67629d0
{"total":7,"rows":[
{"id":1,"name":"All Tasks","begin":"3/4/2010","end":"3/20/2010","progress":60,"iconCls":"icon-ok"},
{"id":2,"name":"Designing","begin":"3/4/2010","end":"3/10/2010","progress":100,"_parentId":1,"state":"closed"},
{"id":21,"name":"Database","persons":2,"begin":"3/4/2010","end":"3/6/2010","progress":100,"_parentId":2},
{"id":22,"name":"UML","persons":1,"begin":"3/7/2010","end":"3/8/2010","progress":100,"_parentId":2},
{"id":23,"name":"Export Document","persons":1,"begin":"3/9/2010","end":"3/10/2010","progress":100,"_parentId":2},
{"id":3,"name":"Coding","persons":2,"begin":"3/11/2010","end":"3/18/2010","progress":80},
{"id":4,"name":"Testing","persons":1,"begin":"3/19/2010","end":"3/20/2010","progress":20}
],"footer":[
{"name":"Total Persons:","persons":7,"iconCls":"icon-sum"}
]}
WebRoot/js/easyui-1.3.5/demo/treegrid/treegrid_data3.json 0 → 100644
View file @ a67629d0
{"total":9,"rows":[
{"id":1,"region":"Wyoming"},
{"id":11,"region":"Albin","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":12,"region":"Canon","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":13,"region":"Egbert","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":1},
{"id":2,"region":"Washington"},
{"id":21,"region":"Bellingham","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":22,"region":"Chehalis","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":23,"region":"Ellensburg","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2},
{"id":24,"region":"Monroe","f1":2000,"f2":1800,"f3":1903,"f4":2183,"f5":2133,"f6":1923,"f7":2018,"f8":1838,"_parentId":2}
],"footer":[
{"region":"Total","f1":14000,"f2":12600,"f3":13321,"f4":15281,"f5":14931,"f6":13461,"f7":14126,"f8":12866}
]}
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/validatebox/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic ValidateBox - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic ValidateBox</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>It's easy to add validate logic to a input box.</div>
</div>
<div style="margin:10px 0;"></div>
<div class="easyui-panel" title="Register" style="width:400px;padding:10px">
<table>
<tr>
<td>User Name:</td>
<td><input class="easyui-validatebox" data-options="required:true,validType:'length[3,10]'"></td>
</tr>
<tr>
<td>Email:</td>
<td><input class="easyui-validatebox" data-options="required:true,validType:'email'"></td>
</tr>
<tr>
<td>Birthday:</td>
<td><input class="easyui-datebox"></td>
</tr>
<tr>
<td>URL:</td>
<td><input class="easyui-validatebox" data-options="required:true,validType:'url'"></td>
</tr>
<tr>
<td>Phone:</td>
<td><input class="easyui-validatebox" data-options="required:true"></td>
</tr>
</table>
</div>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/validatebox/customtooltip.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom ValidateBox Tooltip - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom ValidateBox Tooltip</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to display another tooltip message on a valid textbox.</div>
</div>
<div style="margin:10px 0;"></div>
<div class="easyui-panel" title="Register" style="width:400px;padding:10px">
<table>
<tr>
<td>User Name:</td>
<td><input class="easyui-validatebox" data-options="prompt:'Enter User Name.',required:true,validType:'length[3,10]'"></td>
</tr>
<tr>
<td>Email:</td>
<td><input class="easyui-validatebox" data-options="prompt:'Enter a valid email.',required:true,validType:'email'"></td>
</tr>
<tr>
<td>Birthday:</td>
<td><input class="easyui-datebox"></td>
</tr>
<tr>
<td>URL:</td>
<td><input class="easyui-validatebox" data-options="prompt:'Enter your URL.',required:true,validType:'url'"></td>
</tr>
<tr>
<td>Phone:</td>
<td><input class="easyui-validatebox" data-options="prompt:'Enter your phone number.',required:true"></td>
</tr>
</table>
</div>
<script>
$(function(){
$('input.easyui-validatebox').validatebox({
tipOptions: { // the options to create tooltip
showEvent: 'mouseenter',
hideEvent: 'mouseleave',
showDelay: 0,
hideDelay: 0,
zIndex: '',
onShow: function(){
if (!$(this).hasClass('validatebox-invalid')){
if ($(this).tooltip('options').prompt){
$(this).tooltip('update', $(this).tooltip('options').prompt);
} else {
$(this).tooltip('tip').hide();
}
} else {
$(this).tooltip('tip').css({
color: '#000',
borderColor: '#CC9933',
backgroundColor: '#FFFFCC'
});
}
},
onHide: function(){
if (!$(this).tooltip('options').prompt){
$(this).tooltip('destroy');
}
}
}
}).tooltip({
position: 'right',
content: function(){
var opts = $(this).validatebox('options');
return opts.prompt;
},
onShow: function(){
$(this).tooltip('tip').css({
color: '#000',
borderColor: '#CC9933',
backgroundColor: '#FFFFCC'
});
}
});
});
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/window/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Window - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic Window</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Window can be dragged freely on screen.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('open')">Open</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('close')">Close</a>
</div>
<div id="w" class="easyui-window" title="Basic Window" data-options="iconCls:'icon-save'" style="width:500px;height:200px;padding:10px;">
The window content.
</div>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/window/customtools.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Window Tools - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Window Tools</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the right top buttons to perform actions.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('open')">Open</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('close')">Close</a>
</div>
<div id="w" class="easyui-window" title="Custom Window Tools" data-options="iconCls:'icon-save',minimizable:false,tools:'#tt'" style="width:500px;height:200px;padding:10px;">
The window content.
</div>
<div id="tt">
<a href="javascript:void(0)" class="icon-add" onclick="javascript:alert('add')"></a>
<a href="javascript:void(0)" class="icon-edit" onclick="javascript:alert('edit')"></a>
<a href="javascript:void(0)" class="icon-cut" onclick="javascript:alert('cut')"></a>
<a href="javascript:void(0)" class="icon-help" onclick="javascript:alert('help')"></a>
</div>
</body>
</html>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment