Skip to content
GitLab
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/combobox/navigation.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Navigate ComboBox - 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>Navigate ComboBox</h2>
<div class="demo-info" style="margin-bottom:10px">
<div class="demo-tip icon-tip"></div>
<div>Navigate through combobox items width keyboard to select an item.</div>
</div>
<div style="margin:10px 0;">
<input type="checkbox" checked onchange="$('#cc').combobox({selectOnNavigation:$(this).is(':checked')})">
<span>SelectOnNavigation</span>
</div>
<select id="cc" class="easyui-combobox" name="state" style="width:200px;">
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combobox/remotedata.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Binding to Remote Data - 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>Binding to Remote Data</h2>
<div class="demo-info" style="margin-bottom:10px">
<div class="demo-tip icon-tip"></div>
<div>The ComboBox is bound to a remote data.</div>
</div>
<input class="easyui-combobox"
name="language"
data-options="
url:'combobox_data1.json',
method:'get',
valueField:'id',
textField:'text',
panelHeight:'auto'
">
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combobox/remotejsonp.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Remote JSONP - 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>Remote JSONP</h2>
<div class="demo-info" style="margin-bottom:10px">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to use JSONP to retrieve data from a remote site.</div>
</div>
<input class="easyui-combobox" style="width:250px" data-options="
loader: myloader,
mode: 'remote',
valueField: 'id',
textField: 'name'
">
<script>
var myloader = function(param,success,error){
var q = param.q || '';
if (q.length <= 1){return false}
$.ajax({
url: 'http://ws.geonames.org/searchJSON',
dataType: 'jsonp',
data: {
featureClass: "P",
style: "full",
maxRows: 20,
name_startsWith: q
},
success: function(data){
var items = $.map(data.geonames, function(item){
return {
id: item.geonameId,
name: item.name + (item.adminName1 ? ', ' + item.adminName1 : '') + ', ' + item.countryName
};
});
success(items);
},
error: function(){
error.apply(this, arguments);
}
});
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combogrid/actions.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ComboGrid 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>ComboGrid 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="getValue()">GetValue</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="setValue()">SetValue</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="disable()">Disable</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="enable()">Enable</a>
</div>
<input id="cc" class="easyui-combogrid" style="width:250px" data-options="
panelWidth: 500,
idField: 'itemid',
textField: 'productname',
url: 'datagrid_data1.json',
method: 'get',
columns: [[
{field:'itemid',title:'Item ID',width:80},
{field:'productname',title:'Product',width:120},
{field:'listprice',title:'List Price',width:80,align:'right'},
{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
{field:'attr1',title:'Attribute',width:200},
{field:'status',title:'Status',width:60,align:'center'}
]],
fitColumns: true
">
<script type="text/javascript">
function getValue(){
var val = $('#cc').combogrid('getValue');
alert(val);
}
function setValue(){
$('#cc').combogrid('setValue', 'EST-13');
}
function disable(){
$('#cc').combogrid('disable');
}
function enable(){
$('#cc').combogrid('enable');
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combogrid/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic ComboGrid - 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 ComboGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the right arrow button to show the DataGrid.</div>
</div>
<div style="margin:10px 0"></div>
<select class="easyui-combogrid" style="width:250px" data-options="
panelWidth: 500,
idField: 'itemid',
textField: 'productname',
url: 'datagrid_data1.json',
method: 'get',
columns: [[
{field:'itemid',title:'Item ID',width:80},
{field:'productname',title:'Product',width:120},
{field:'listprice',title:'List Price',width:80,align:'right'},
{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
{field:'attr1',title:'Attribute',width:200},
{field:'status',title:'Status',width:60,align:'center'}
]],
fitColumns: true
">
</select>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combogrid/datagrid_data1.json 0 → 100644
View file @ a67629d0
{"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"},
{"selected":true,"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"}
]}
WebRoot/js/easyui-1.3.5/demo/combogrid/initvalue.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Initialize Value for ComboGrid - 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>Initialize Value for ComboGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Initialize value when ComboGrid is created.</div>
</div>
<div style="margin:10px 0"></div>
<input class="easyui-combogrid" style="width:250px" value="EST-12" data-options="
panelWidth: 500,
idField: 'itemid',
textField: 'productname',
url: 'datagrid_data1.json',
method: 'get',
columns: [[
{field:'itemid',title:'Item ID',width:80},
{field:'productname',title:'Product',width:120},
{field:'listprice',title:'List Price',width:80,align:'right'},
{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
{field:'attr1',title:'Attribute',width:200},
{field:'status',title:'Status',width:60,align:'center'}
]],
fitColumns: true
">
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combogrid/multiple.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Multiple ComboGrid - 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>Multiple ComboGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the right arrow button to show the DataGrid and select items.</div>
</div>
<div style="margin:10px 0"></div>
<select class="easyui-combogrid" style="width:250px" data-options="
panelWidth: 500,
multiple: true,
idField: 'itemid',
textField: 'productname',
url: 'datagrid_data1.json',
method: 'get',
columns: [[
{field:'ck',checkbox:true},
{field:'itemid',title:'Item ID',width:80},
{field:'productname',title:'Product',width:120},
{field:'listprice',title:'List Price',width:80,align:'right'},
{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
{field:'attr1',title:'Attribute',width:200},
{field:'status',title:'Status',width:60,align:'center'}
]],
fitColumns: true
">
</select>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combogrid/navigation.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Navigate ComboGrid - 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>Navigate ComboGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Navigate through grid items with keyboard to select an item.</div>
</div>
<div style="margin:10px 0">
<input type="checkbox" checked onchange="$('#cc').combogrid({selectOnNavigation:$(this).is(':checked')})">
<span>SelectOnNavigation</span>
</div>
<select id="cc" class="easyui-combogrid" style="width:250px" data-options="
panelWidth: 500,
idField: 'itemid',
textField: 'productname',
url: 'datagrid_data1.json',
method: 'get',
columns: [[
{field:'itemid',title:'Item ID',width:80},
{field:'productname',title:'Product',width:120},
{field:'listprice',title:'List Price',width:80,align:'right'},
{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
{field:'attr1',title:'Attribute',width:200},
{field:'status',title:'Status',width:60,align:'center'}
]],
fitColumns: true
">
</select>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combotree/actions.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ComboTree 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>ComboTree 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="getValue()">GetValue</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="setValue()">SetValue</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="disable()">Disable</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="enable()">Enable</a>
</div>
<input id="cc" class="easyui-combotree" data-options="url:'tree_data1.json',method:'get',required:true" style="width:200px;">
<script type="text/javascript">
function getValue(){
var val = $('#cc').combotree('getValue');
alert(val);
}
function setValue(){
$('#cc').combotree('setValue', '122');
}
function disable(){
$('#cc').combotree('disable');
}
function enable(){
$('#cc').combotree('enable');
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combotree/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic ComboTree - 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 ComboTree</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the right arrow button to show the tree panel.</div>
</div>
<div style="margin:10px 0"></div>
<input class="easyui-combotree" data-options="url:'tree_data1.json',method:'get',required:true" style="width:200px;">
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combotree/initvalue.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Initialize Value for ComboTree - 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>Initialize Value for ComboTree</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Initialize Value when ComboTree is created.</div>
</div>
<div style="margin:10px 0"></div>
<input class="easyui-combotree" value="122" data-options="url:'tree_data1.json',method:'get',required:true" style="width:200px;">
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combotree/multiple.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Multiple ComboTree - 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>Multiple ComboTree</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the right arrow button to show the tree panel and select multiple nodes.</div>
</div>
<div style="margin:10px 0">
<span>Cascade Check: </span>
<input type="checkbox" checked onclick="$('#cc').combotree({cascadeCheck:$(this).is(':checked')})">
</div>
<select id="cc" class="easyui-combotree" data-options="url:'tree_data1.json',method:'get'" multiple style="width:200px;"></select>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/combotree/tree_data1.json 0 → 100644
View file @ a67629d0
[{
"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"
}]
}]
WebRoot/js/easyui-1.3.5/demo/datagrid/aligncolumns.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Aligning Columns in DataGrid - 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>Aligning Columns in DataGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Use align and halign properties to set the alignment of the columns and their header.</div>
</div>
<div style="margin:10px 0;"></div>
<table class="easyui-datagrid" title="Aligning Columns in DataGrid" style="width:700px;height:250px"
data-options="singleSelect:true,collapsible:true,url:'datagrid_data1.json',method:'get'">
<thead>
<tr>
<th data-options="field:'itemid',width:80,halign:'center'">Item ID</th>
<th data-options="field:'productid',width:100,halign:'center'">Product</th>
<th data-options="field:'listprice',width:80,align:'right',halign:'center'">List Price</th>
<th data-options="field:'unitcost',width:80,align:'right',halign:'center'">Unit Cost</th>
<th data-options="field:'attr1',width:250,halign:'center'">Attribute</th>
<th data-options="field:'status',width:60,align:'center',halign:'center'">Status</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/datagrid/basic.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic DataGrid - 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 DataGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>The DataGrid is created from markup, no JavaScript code needed.</div>
</div>
<div style="margin:10px 0;"></div>
<table class="easyui-datagrid" title="Basic DataGrid" style="width:700px;height:250px"
data-options="singleSelect:true,collapsible:true,url:'datagrid_data1.json',method:'get'">
<thead>
<tr>
<th data-options="field:'itemid',width:80">Item ID</th>
<th data-options="field:'productid',width:100">Product</th>
<th data-options="field:'listprice',width:80,align:'right'">List Price</th>
<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
<th data-options="field:'attr1',width:250">Attribute</th>
<th data-options="field:'status',width:60,align:'center'">Status</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/datagrid/cellediting.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Cell Editing in DataGrid - 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>Cell Editing in DataGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click a cell to start editing.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="dg" class="easyui-datagrid" title="Cell Editing in DataGrid" style="width:700px;height:auto"
data-options="
iconCls: 'icon-edit',
singleSelect: true,
url: 'datagrid_data1.json',
method:'get',
onClickCell: onClickCell
">
<thead>
<tr>
<th data-options="field:'itemid',width:80">Item ID</th>
<th data-options="field:'productid',width:100,editor:'text'">Product</th>
<th data-options="field:'listprice',width:80,align:'right',editor:{type:'numberbox',options:{precision:1}}">List Price</th>
<th data-options="field:'unitcost',width:80,align:'right',editor:'numberbox'">Unit Cost</th>
<th data-options="field:'attr1',width:250,editor:'text'">Attribute</th>
<th data-options="field:'status',width:60,align:'center',editor:{type:'checkbox',options:{on:'P',off:''}}">Status</th>
</tr>
</thead>
</table>
<script type="text/javascript">
$.extend($.fn.datagrid.methods, {
editCell: function(jq,param){
return jq.each(function(){
var opts = $(this).datagrid('options');
var fields = $(this).datagrid('getColumnFields',true).concat($(this).datagrid('getColumnFields'));
for(var i=0; i<fields.length; i++){
var col = $(this).datagrid('getColumnOption', fields[i]);
col.editor1 = col.editor;
if (fields[i] != param.field){
col.editor = null;
}
}
$(this).datagrid('beginEdit', param.index);
for(var i=0; i<fields.length; i++){
var col = $(this).datagrid('getColumnOption', fields[i]);
col.editor = col.editor1;
}
});
}
});
var editIndex = undefined;
function endEditing(){
if (editIndex == undefined){return true}
if ($('#dg').datagrid('validateRow', editIndex)){
$('#dg').datagrid('endEdit', editIndex);
editIndex = undefined;
return true;
} else {
return false;
}
}
function onClickCell(index, field){
if (endEditing()){
$('#dg').datagrid('selectRow', index)
.datagrid('editCell', {index:index,field:field});
editIndex = index;
}
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/datagrid/cellstyle.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DataGrid Cell 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>DataGrid Cell Style</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>The cells which listprice value is less than 30 are highlighted.</div>
</div>
<div style="margin:10px 0;"></div>
<table class="easyui-datagrid" title="DataGrid Cell Style" style="width:700px;height:250px"
data-options="
singleSelect: true,
iconCls: 'icon-save',
url: 'datagrid_data1.json',
method: 'get'
">
<thead>
<tr>
<th data-options="field:'itemid',width:80">Item ID</th>
<th data-options="field:'productid',width:100">Product</th>
<th data-options="field:'listprice',width:80,align:'right',styler:cellStyler">List Price</th>
<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
<th data-options="field:'attr1',width:250">Attribute</th>
<th data-options="field:'status',width:60,align:'center'">Status</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function cellStyler(value,row,index){
if (value < 30){
return 'background-color:#ffee00;color:red;';
}
}
</script>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/datagrid/checkbox.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CheckBox Selection on DataGrid - 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>CheckBox Selection on DataGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the checkbox on header to select or unselect all selections.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="dg" class="easyui-datagrid" title="CheckBox Selection on DataGrid" style="width:700px;height:250px"
data-options="rownumbers:true,singleSelect:true,url:'datagrid_data1.json',method:'get'">
<thead>
<tr>
<th data-options="field:'ck',checkbox:true"></th>
<th data-options="field:'itemid',width:80">Item ID</th>
<th data-options="field:'productid',width:100">Product</th>
<th data-options="field:'listprice',width:80,align:'right'">List Price</th>
<th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
<th data-options="field:'attr1',width:220">Attribute</th>
<th data-options="field:'status',width:60,align:'center'">Status</th>
</tr>
</thead>
</table>
<div style="margin:10px 0;">
<span>Selection Mode: </span>
<select onchange="$('#dg').datagrid({singleSelect:(this.value==0)})">
<option value="0">Single Row</option>
<option value="1">Multiple Rows</option>
</select><br/>
SelectOnCheck: <input type="checkbox" checked onchange="$('#dg').datagrid({selectOnCheck:$(this).is(':checked')})"><br/>
CheckOnSelect: <input type="checkbox" checked onchange="$('#dg').datagrid({checkOnSelect:$(this).is(':checked')})">
</div>
</body>
</html>
\ No newline at end of file
WebRoot/js/easyui-1.3.5/demo/datagrid/clientpagination.html 0 → 100644
View file @ a67629d0
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Client Side Pagination in DataGrid - 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 DataGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to implement client side pagination in DataGrid.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="dg" title="Client Side Pagination" style="width:700px;height:300px" data-options="
rownumbers:true,
singleSelect:true,
autoRowHeight:false,
pagination:true,
pageSize:10">
<thead>
<tr>
<th field="inv" width="80">Inv No</th>
<th field="date" width="100">Date</th>
<th field="name" width="80">Name</th>
<th field="amount" width="80" align="right">Amount</th>
<th field="price" width="80" align="right">Price</th>
<th field="cost" width="100" align="right">Cost</th>
<th field="note" width="110">Note</th>
</tr>
</thead>
</table>
<script>
function getData(){
var rows = [];
for(var i=1; i<=800; i++){
var amount = Math.floor(Math.random()*1000);
var price = Math.floor(Math.random()*1000);
rows.push({
inv: 'Inv No '+i,
date: $.fn.datebox.defaults.formatter(new Date()),
name: 'Name '+i,
amount: amount,
price: price,
cost: amount*price,
note: 'Note '+i
});
}
return rows;
}
function pagerFilter(data){
if (typeof data.length == 'number' && typeof data.splice == 'function'){ // is array
data = {
total: data.length,
rows: data
}
}
var dg = $(this);
var opts = dg.datagrid('options');
var pager = dg.datagrid('getPager');
pager.pagination({
onSelectPage:function(pageNum, pageSize){
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
pager.pagination('refresh',{
pageNumber:pageNum,
pageSize:pageSize
});
dg.datagrid('loadData',data);
}
});
if (!data.originalRows){
data.originalRows = (data.rows);
}
var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
var end = start + parseInt(opts.pageSize);
data.rows = (data.originalRows.slice(start, end));
return data;
}
$(function(){
$('#dg').datagrid({loadFilter:pagerFilter}).datagrid('loadData', getData());
});
</script>
</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