In Default.aspx page
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
function Disp(obj) {
// debugger;
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/BindDatatable",
data: '{ID:"' + obj + '"}',
dataType: "json",
success: function (data) {
// debugger;
if (data.d.length == 0) {
}
else {
$("#ctl00_CPHBody_gvDisplay").show();
$("#ctl00_CPHBody_gvDisplay tr:has(td)").remove();
for (var i = 0; i < data.d.length; i++) {
$("#ctl00_CPHBody_gvDisplay").append("<tr><td width='35%'>" + data.d[i].Code + "</td><td width='45%'>" + data.d[i].Description + "</td><td width='30%'>" + data.d[i].Date + "</td><td width='20%'>" + data.d[i].Seq + "</td></tr>");
}
}
},
error: function (result) {
alert("Error");
}
});
}
<asp:Button ID="btnAdd" runat="server" Text="Add" OnClientClick="Disp(2)" />
<table width="100%">
<tr>
<td>
<asp:GridView ID="gvDisplay" runat="server">
<HeaderStyle CssClass="tdheader" />
<RowStyle CssClass="trwhite" />
</asp:GridView>
</td>
</tr>
</table>
In Default.aspx.cs file
[WebMethod]
public static UserDetails[] BindDatatable(string ID)
{
DataTable dt = new DataTable();
List<UserDetails> details = new List<UserDetails>();
if (ID != "undefined")
{
dt = "fetch data from database";
}
foreach (DataRow dtrow in dt.Rows)
{
UserDetails user = new UserDetails();
user.FundCode = dtrow["Code"].ToString();
user.FundDescription = dtrow["Description"].ToString();
user.FundDate = dtrow["Date"].ToString();
user.Seq = dtrow["Seq"].ToString();
details.Add(user);
}
return details.ToArray();
}
public class UserDetails
{
public string Code { get; set; }
public string Description { get; set; }
public string Date { get; set; }
public string Seq { get; set; }
}
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
function Disp(obj) {
// debugger;
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/BindDatatable",
data: '{ID:"' + obj + '"}',
dataType: "json",
success: function (data) {
// debugger;
if (data.d.length == 0) {
}
else {
$("#ctl00_CPHBody_gvDisplay").show();
$("#ctl00_CPHBody_gvDisplay tr:has(td)").remove();
for (var i = 0; i < data.d.length; i++) {
$("#ctl00_CPHBody_gvDisplay").append("<tr><td width='35%'>" + data.d[i].Code + "</td><td width='45%'>" + data.d[i].Description + "</td><td width='30%'>" + data.d[i].Date + "</td><td width='20%'>" + data.d[i].Seq + "</td></tr>");
}
}
},
error: function (result) {
alert("Error");
}
});
}
<asp:Button ID="btnAdd" runat="server" Text="Add" OnClientClick="Disp(2)" />
<table width="100%">
<tr>
<td>
<asp:GridView ID="gvDisplay" runat="server">
<HeaderStyle CssClass="tdheader" />
<RowStyle CssClass="trwhite" />
</asp:GridView>
</td>
</tr>
</table>
In Default.aspx.cs file
[WebMethod]
public static UserDetails[] BindDatatable(string ID)
{
DataTable dt = new DataTable();
List<UserDetails> details = new List<UserDetails>();
if (ID != "undefined")
{
dt = "fetch data from database";
}
foreach (DataRow dtrow in dt.Rows)
{
UserDetails user = new UserDetails();
user.FundCode = dtrow["Code"].ToString();
user.FundDescription = dtrow["Description"].ToString();
user.FundDate = dtrow["Date"].ToString();
user.Seq = dtrow["Seq"].ToString();
details.Add(user);
}
return details.ToArray();
}
public class UserDetails
{
public string Code { get; set; }
public string Description { get; set; }
public string Date { get; set; }
public string Seq { get; set; }
}
Hi please look for ASP.Net GridView
ReplyDeletehttp://www.reddyinfosoft.blogspot.in/2012/12/jquery-datatable-plugin-in-aspnet-using_15.html
and For ASP.Net Repeater
http://www.reddyinfosoft.blogspot.in/2012/12/jquery-datatable-plugin-in-aspnet-using.html