<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312">
<title>Client Side Pagination - jQuery EasyUI Demo</title>
<link href="../themes/icon.css" rel="stylesheet" />
<link href="../themes/default/easyui.css" rel="stylesheet" />
<link href="../src/demo.css" rel="stylesheet" />
<script src="../comjs/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="../comjs/jquery.easyui.min.js" type="text/javascript"></script>
<body>
<h2>Client Side Pagination</h2>
<div title="执行程序" id="dialogs" class="easyui-window" style="500px;height:auto;">
<textarea id="txtArea"style="color:#0094ff; 500px; height:300px;background-image:url('comjs/70bOOOPIC07_202.jpg')">ddf</textarea>
</div>
<div style="margin:10px 0;">
<a href="#" class="easyui-linkbutton" onclick="start()">Start</a>
</div>
<div id="p" class="easyui-progressbar" style="400px;"></div>
<script>
var cc = 0;
var counts = 0;
var percent;
var rows = [];
function start() {
//aa();
hha();
var value = $('#p').progressbar('getValue');
if (value < 100) {
//value += Math.floor(Math.random() * 10);
//percent =Math.floor( cc / counts);
if (percent>=0.99) {
percent = 1;
$('#p').hide();
}
$('#p').progressbar('setValue',Math.floor( percent*100));
setTimeout(arguments.callee, 0.01);
}
};
</script>
<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>
<script type="text/javascript">
var rows = [];
function hha() {
$("#txtArea").val("");
for (var i = 0; i < 5;i++) {
var Midval =$("#txtArea").val() + rows.rows[cc + i].mId + " " + rows.rows[cc + i].mName + " " + rows.rows[cc + i].mIsDel + " " + rows.rows[cc + i].mAddtime + "
";
$("#txtArea").val(Midval);
$("#txtArea").val().replace(/
/g, "<br/>");
}
percent =( cc / counts);
if (cc < rows.rows.length) {
cc = cc + 1;
}
}
function aa() {
setInterval("hha()", 0.2);
}
$(function () {
$.ajax({//'datagrid_data.aspx',
url: 'Data.ashx',
type: "get",
async: false,
dataType: "json",
data: 'id=' + Math.random(),
success: function (json) {
rows = json;
counts = rows.rows.length;
},
error: function (xhr, status, errorThrown) {
alert("errorThrown=" + errorThrown);
}
});
});
</script>
</body>
</html>