This commit is contained in:
18
WebRoot/js/easyui-1.3.5/demo/layout/_content.html
Normal file
18
WebRoot/js/easyui-1.3.5/demo/layout/_content.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AJAX Content</title>
|
||||
</head>
|
||||
<body>
|
||||
<p style="font-size:14px">jQuery EasyUI framework help you build your web page easily.</p>
|
||||
<ul>
|
||||
<li>easyui is a collection of user-interface plugin based on jQuery.</li>
|
||||
<li>easyui provides essential functionality for building modern, interactive, javascript applications.</li>
|
||||
<li>using easyui you don't need to write many javascript code, you usually defines user-interface by writing some HTML markup.</li>
|
||||
<li>complete framework for HTML5 web page.</li>
|
||||
<li>easyui save your time and scales while developing your products.</li>
|
||||
<li>easyui is very easy but powerful.</li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
56
WebRoot/js/easyui-1.3.5/demo/layout/addremove.html
Normal file
56
WebRoot/js/easyui-1.3.5/demo/layout/addremove.html
Normal file
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Add and Remove Layout - 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>Add and Remove Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>Click the buttons below to add or remove region panel of layout.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;">
|
||||
<span>Select Region Panel:</span>
|
||||
<select id="region">
|
||||
<option value="north">North</option>
|
||||
<option value="south">South</option>
|
||||
<option value="east">East</option>
|
||||
<option value="west">West</option>
|
||||
</select>
|
||||
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="addPanel()">Add</a>
|
||||
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="removePanel()">Remove</a>
|
||||
</div>
|
||||
<div id="cc" class="easyui-layout" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south',split:true" style="height:50px;"></div>
|
||||
<div data-options="region:'east',split:true" title="East" style="width:100px;"></div>
|
||||
<div data-options="region:'west',split:true" title="West" style="width:100px;"></div>
|
||||
<div data-options="region:'center',title:'Center'"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
function addPanel(){
|
||||
var region = $('#region').val();
|
||||
var options = {
|
||||
region: region
|
||||
};
|
||||
if (region=='north' || region=='south'){
|
||||
options.height = 50;
|
||||
} else {
|
||||
options.width = 100;
|
||||
options.split = true;
|
||||
options.title = $('#region option:selected').text();
|
||||
}
|
||||
$('#cc').layout('add', options);
|
||||
}
|
||||
function removePanel(){
|
||||
$('#cc').layout('remove', $('#region').val());
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
61
WebRoot/js/easyui-1.3.5/demo/layout/autoheight.html
Normal file
61
WebRoot/js/easyui-1.3.5/demo/layout/autoheight.html
Normal file
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Auto Height for Layout - 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>Auto Height for Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>This example shows how to auto adjust layout height after dynamically adding items.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;">
|
||||
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="addItem()">Add Item</a>
|
||||
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="removeItem()">Remove Item</a>
|
||||
</div>
|
||||
<div id="cc" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south'" style="height:50px;"></div>
|
||||
<div data-options="region:'west'" style="width:150px;"></div>
|
||||
<div data-options="region:'center'" style="padding:20px">
|
||||
<p>Panel Content.</p>
|
||||
<p>Panel Content.</p>
|
||||
<p>Panel Content.</p>
|
||||
<p>Panel Content.</p>
|
||||
<p>Panel Content.</p>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$(function(){
|
||||
$('#cc').layout();
|
||||
setHeight();
|
||||
});
|
||||
|
||||
function addItem(){
|
||||
$('#cc').layout('panel','center').append('<p>More Panel Content.</p>');
|
||||
setHeight();
|
||||
}
|
||||
|
||||
function removeItem(){
|
||||
$('#cc').layout('panel','center').find('p:last').remove();
|
||||
setHeight();
|
||||
}
|
||||
|
||||
function setHeight(){
|
||||
var c = $('#cc');
|
||||
var p = c.layout('panel','center'); // get the center panel
|
||||
var oldHeight = p.panel('panel').outerHeight();
|
||||
p.panel('resize', {height:'auto'});
|
||||
var newHeight = p.panel('panel').outerHeight();
|
||||
c.height(c.height() + newHeight - oldHeight);
|
||||
c.layout('resize');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
42
WebRoot/js/easyui-1.3.5/demo/layout/basic.html
Normal file
42
WebRoot/js/easyui-1.3.5/demo/layout/basic.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Basic Layout - 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 Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>The layout contains north,south,west,east and center regions.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;"></div>
|
||||
<div class="easyui-layout" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south',split:true" style="height:50px;"></div>
|
||||
<div data-options="region:'east',split:true" title="East" style="width:180px;"></div>
|
||||
<div data-options="region:'west',split:true" title="West" style="width:100px;"></div>
|
||||
<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
|
||||
<table class="easyui-datagrid"
|
||||
data-options="url:'datagrid_data1.json',method:'get',border:false,singleSelect:true,fit:true,fitColumns:true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-options="field:'itemid'" width="80">Item ID</th>
|
||||
<th data-options="field:'productid'" width="100">Product ID</th>
|
||||
<th data-options="field:'listprice',align:'right'" width="80">List Price</th>
|
||||
<th data-options="field:'unitcost',align:'right'" width="80">Unit Cost</th>
|
||||
<th data-options="field:'attr'" width="150">Attribute</th>
|
||||
<th data-options="field:'status',align:'center'" width="50">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
60
WebRoot/js/easyui-1.3.5/demo/layout/complex.html
Normal file
60
WebRoot/js/easyui-1.3.5/demo/layout/complex.html
Normal file
@@ -0,0 +1,60 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Complex Layout - 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>Complex Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>This sample shows how to create a complex layout.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;"></div>
|
||||
<div class="easyui-layout" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south',split:true" style="height:50px;"></div>
|
||||
<div data-options="region:'east',split:true" title="East" style="width:180px;">
|
||||
<ul class="easyui-tree" data-options="url:'tree_data1.json',method:'get',animate:true,dnd:true"></ul>
|
||||
</div>
|
||||
<div data-options="region:'west',split:true" title="West" style="width:100px;">
|
||||
<div class="easyui-accordion" data-options="fit:true,border:false">
|
||||
<div title="Title1" style="padding:10px;">
|
||||
content1
|
||||
</div>
|
||||
<div title="Title2" data-options="selected:true" style="padding:10px;">
|
||||
content2
|
||||
</div>
|
||||
<div title="Title3" style="padding:10px">
|
||||
content3
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
|
||||
<div class="easyui-tabs" data-options="fit:true,border:false,plain:true">
|
||||
<div title="About" data-options="href:'_content.html'" style="padding:10px"></div>
|
||||
<div title="DataGrid" style="padding:5px">
|
||||
<table class="easyui-datagrid"
|
||||
data-options="url:'datagrid_data1.json',method:'get',singleSelect:true,fit:true,fitColumns:true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-options="field:'itemid'" width="80">Item ID</th>
|
||||
<th data-options="field:'productid'" width="100">Product ID</th>
|
||||
<th data-options="field:'listprice',align:'right'" width="80">List Price</th>
|
||||
<th data-options="field:'unitcost',align:'right'" width="80">Unit Cost</th>
|
||||
<th data-options="field:'attr1'" width="150">Attribute</th>
|
||||
<th data-options="field:'status',align:'center'" width="50">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
12
WebRoot/js/easyui-1.3.5/demo/layout/datagrid_data1.json
Normal file
12
WebRoot/js/easyui-1.3.5/demo/layout/datagrid_data1.json
Normal file
@@ -0,0 +1,12 @@
|
||||
{"total":28,"rows":[
|
||||
{"productid":"FI-SW-01","productname":"Koi","unitcost":10.00,"status":"P","listprice":36.50,"attr1":"Large","itemid":"EST-1"},
|
||||
{"productid":"K9-DL-01","productname":"Dalmation","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},
|
||||
{"productid":"RP-SN-01","productname":"Rattlesnake","unitcost":12.00,"status":"P","listprice":38.50,"attr1":"Venomless","itemid":"EST-11"},
|
||||
{"productid":"RP-SN-01","productname":"Rattlesnake","unitcost":12.00,"status":"P","listprice":26.50,"attr1":"Rattleless","itemid":"EST-12"},
|
||||
{"productid":"RP-LI-02","productname":"Iguana","unitcost":12.00,"status":"P","listprice":35.50,"attr1":"Green Adult","itemid":"EST-13"},
|
||||
{"productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":158.50,"attr1":"Tailless","itemid":"EST-14"},
|
||||
{"productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":83.50,"attr1":"With tail","itemid":"EST-15"},
|
||||
{"productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":23.50,"attr1":"Adult Female","itemid":"EST-16"},
|
||||
{"productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":89.50,"attr1":"Adult Male","itemid":"EST-17"},
|
||||
{"productid":"AV-CB-01","productname":"Amazon Parrot","unitcost":92.00,"status":"P","listprice":63.50,"attr1":"Adult Male","itemid":"EST-18"}
|
||||
]}
|
||||
19
WebRoot/js/easyui-1.3.5/demo/layout/full.html
Normal file
19
WebRoot/js/easyui-1.3.5/demo/layout/full.html
Normal file
@@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Full Layout - 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 class="easyui-layout">
|
||||
<div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">north region</div>
|
||||
<div data-options="region:'west',split:true,title:'West'" style="width:150px;padding:10px;">west content</div>
|
||||
<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
|
||||
<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>
|
||||
<div data-options="region:'center',title:'Center'"></div>
|
||||
</body>
|
||||
</html>
|
||||
34
WebRoot/js/easyui-1.3.5/demo/layout/nestedlayout.html
Normal file
34
WebRoot/js/easyui-1.3.5/demo/layout/nestedlayout.html
Normal file
@@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Nested Layout - 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>Nested Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>The layout region panel contains another layout or other components.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;"></div>
|
||||
<div class="easyui-layout" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south',split:true" style="height:50px;"></div>
|
||||
<div data-options="region:'east',split:true" title="East" style="width:180px;"></div>
|
||||
<div data-options="region:'west',split:true" title="West" style="width:100px;"></div>
|
||||
<div data-options="region:'center',iconCls:'icon-ok'" title="Center">
|
||||
<div class="easyui-layout" data-options="fit:true">
|
||||
<div data-options="region:'north',split:true,border:false" style="height:50px"></div>
|
||||
<div data-options="region:'west',split:true,border:false" style="width:100px"></div>
|
||||
<div data-options="region:'center',border:false"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
37
WebRoot/js/easyui-1.3.5/demo/layout/nocollapsible.html
Normal file
37
WebRoot/js/easyui-1.3.5/demo/layout/nocollapsible.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>No collapsible button in Layout - 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>No collapsible button in Layout</h2>
|
||||
<div class="demo-info">
|
||||
<div class="demo-tip icon-tip"></div>
|
||||
<div>The layout region panel has no collapsible button.</div>
|
||||
</div>
|
||||
<div style="margin:10px 0;"></div>
|
||||
<div class="easyui-layout" style="width:700px;height:350px;">
|
||||
<div data-options="region:'north'" style="height:50px"></div>
|
||||
<div data-options="region:'south',split:true" style="height:50px;"></div>
|
||||
<div data-options="region:'east',split:true,title:'East',collapsible:false" style="width:250px;">
|
||||
<table id="tt" class="easyui-propertygrid" data-options="
|
||||
url: 'propertygrid_data1.json',
|
||||
method: 'get',
|
||||
showGroup: true,
|
||||
fit: true,
|
||||
border: false
|
||||
">
|
||||
</table>
|
||||
</div>
|
||||
<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok',href:'_content.html'" style="padding:10px">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
20
WebRoot/js/easyui-1.3.5/demo/layout/propertygrid_data1.json
Normal file
20
WebRoot/js/easyui-1.3.5/demo/layout/propertygrid_data1.json
Normal file
@@ -0,0 +1,20 @@
|
||||
{"total":7,"rows":[
|
||||
{"name":"Name","value":"Bill Smith","group":"ID Settings","editor":"text"},
|
||||
{"name":"Address","value":"","group":"ID Settings","editor":"text"},
|
||||
{"name":"Age","value":"40","group":"ID Settings","editor":"numberbox"},
|
||||
{"name":"Birthday","value":"01/02/2012","group":"ID Settings","editor":"datebox"},
|
||||
{"name":"SSN","value":"123-456-7890","group":"ID Settings","editor":"text"},
|
||||
{"name":"Email","value":"bill@gmail.com","group":"Marketing Settings","editor":{
|
||||
"type":"validatebox",
|
||||
"options":{
|
||||
"validType":"email"
|
||||
}
|
||||
}},
|
||||
{"name":"FrequentBuyer","value":"false","group":"Marketing Settings","editor":{
|
||||
"type":"checkbox",
|
||||
"options":{
|
||||
"on":true,
|
||||
"off":false
|
||||
}
|
||||
}}
|
||||
]}
|
||||
49
WebRoot/js/easyui-1.3.5/demo/layout/tree_data1.json
Normal file
49
WebRoot/js/easyui-1.3.5/demo/layout/tree_data1.json
Normal file
@@ -0,0 +1,49 @@
|
||||
[{
|
||||
"id":1,
|
||||
"text":"My Documents",
|
||||
"children":[{
|
||||
"id":11,
|
||||
"text":"Photos",
|
||||
"state":"closed",
|
||||
"children":[{
|
||||
"id":111,
|
||||
"text":"Friend"
|
||||
},{
|
||||
"id":112,
|
||||
"text":"Wife"
|
||||
},{
|
||||
"id":113,
|
||||
"text":"Company"
|
||||
}]
|
||||
},{
|
||||
"id":12,
|
||||
"text":"Program Files",
|
||||
"children":[{
|
||||
"id":121,
|
||||
"text":"Intel"
|
||||
},{
|
||||
"id":122,
|
||||
"text":"Java",
|
||||
"attributes":{
|
||||
"p1":"Custom Attribute1",
|
||||
"p2":"Custom Attribute2"
|
||||
}
|
||||
},{
|
||||
"id":123,
|
||||
"text":"Microsoft Office"
|
||||
},{
|
||||
"id":124,
|
||||
"text":"Games",
|
||||
"checked":true
|
||||
}]
|
||||
},{
|
||||
"id":13,
|
||||
"text":"index.html"
|
||||
},{
|
||||
"id":14,
|
||||
"text":"about.html"
|
||||
},{
|
||||
"id":15,
|
||||
"text":"welcome.html"
|
||||
}]
|
||||
}]
|
||||
Reference in New Issue
Block a user