jquery datatable display json data using j query
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebApplication3.WebForm4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="Referances/Jquery-datatable.css" rel="stylesheet" />
<script src="Referances/jquery-1.8.2.min.js"></script>
<script src="Referances/jquery.dataTables.min.js"></script>
<script type="text/javascript">
$(function () {
$("#example").dataTable({
"aaData": [
[
"Garrett Winters",
"Accountant",
"$170,750",
"2011/07/25 12:00:00"
],
[
"Brielle Williamson",
"Integration Specialist",
"$372,000",
"2012/12/02 12:00:00"
],
[
"Ashton Cox",
"Junior Technical Author",
"$86,000",
"2009/01/12 12:00:00"
],
["Airi Satou",
"Accountant",
"$162,700",
"2008/11/28 12:00:00"
],
[
"Caesar Vance",
"Pre-Sales Support",
"$106,450",
"2011/12/12 12:00:00"
],
[
"Shad Decker",
"Regional Director",
"$183,000",
"2008/11/13 12:00:00"
],
[
"Cedric Kelly",
"Senior Javascript Developer",
"$433,060",
"2012/03/29 12:00:00"
],
[
"Haley Kennedy",
"Senior Marketing Designer",
"$313,500",
"2012/12/18 12:00:00"
],
[
"Colleen Hurst",
"Javascript Developer",
"$205,500",
"2009/09/15 12:00:00"
],
[
"Dai Rios",
"Personnel Lead",
"$217,500",
"2012/09/26 12:00:00"
],
[
"Herrod Chandler",
"Sales Assistant",
"$137,500",
"2012/08/06 12:00:00"
],
[
"Rhona Davidson",
"Integration Specialist",
"$327,900",
"2010/10/14 12:00:00"
],
[
"Sonya Frost",
"Software Engineer",
"$103,600",
"2008/12/13 12:00:00"
],
[
"Jena Gaines",
"Office Manager",
"$90,560",
"2008/12/19 12:00:00"
],
[
"Quinn Flynn",
"Support Lead",
"$342,000",
"2013/03/03 12:00:00"
]
]
});
})
</script>
<style type="text/css">
table, td, tr, th {
border: 1px solid black;
border-collapse: collapse;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="example">
<thead>
<tr>
<th>Employee Name</th>
<th>Department </th>
<th>CTC per annum</th>
<th>Joining Date</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</form>
</body>
</html>
Comments
Post a Comment