@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<link rel="stylesheet" href="~/Content/bootstrap.css" />
<link rel="stylesheet" href="~/Content/DataTables/css/jquery.dataTables.css" />
<link rel="stylesheet" href="~/Content/DataTables/css/jquery.dataTables_themeroller.css" />
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" src="~/Scripts/DataTables/jquery.dataTables.js"></script>
<style>
.tb {
border:solid 1px #000000;
height:auto;
width:auto;
}
</style>
</head>
<body>
<div class="container" style="padding-top:20px">
<div id="divTblRasPoint" class="tb">
<table id="tblRasPoint" class="table table-hover table-bordered table-condensed table-responsive table-striped" style="width:1000px">
<thead id="tblRasPointHeader">
<tr>
<th>EID</th>
<th>NAME</th>
<th>ACTION</th>
</tr>
</thead>
<tbody id="tblRasPointBody"></tbody>
</table>
</div>
</div>
</body>
</html>
<script type="text/javascript">
$(function () {
$.ajax({
url: '/Test/Gets',
success: function (data) {
var tr = "";
$.each(data, function (i, j) {
tr += "<tr><td>" + j.EID + "</td><td>" + j.NAME + "</td><td><a onclick='edit(" + j.EID + ")'>Edit</a>|<a onclick='del(" + j.EID + ")'>Delete</a></td></tr>";
})
$("#tblRasPointBody").append(tr);
setInterval(x(), 3000);
}
});
function x()
{
$("#tblRasPoint").DataTable({
"order": [[0, "asc"]],
"lengthMenu": [[2, 10, 25, 50, -1], [2, 10, 25, 50, "All"]],
"scroller": true,
"orderClasses": false,
})
}
});
function edit(s) {
alert(s);
}
function del(s) {
alert(s);
}
</script>
No comments:
Post a Comment