Hi Makumbi,
Please refer below sample.
HTML
<div class="auto-style1">
<asp:GridView ID="gvCustomers" runat="server" CssClass="display compact" AutoGenerateColumns="False" PageSize="25">
<Columns>
<asp:BoundField DataField="Account" HeaderText="Account" />
<asp:BoundField DataField="Name" HeaderText="Name">
<ControlStyle Height="4988px" />
</asp:BoundField>
<asp:BoundField DataField="Classr" HeaderText="Class" />
<asp:BoundField DataField="Stream" HeaderText="Stream" />
<asp:BoundField DataField="STDTYPE" HeaderText="STDTYPE" />
<asp:BoundField DataField="SEX" HeaderText="Sex" />
<asp:BoundField DataField="Colour" HeaderText="Colour" />
<asp:BoundField DataField="ACNOS" HeaderText="ACNOS" />
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:Button Text="Select" runat="server" CssClass="btn btn-primary" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<script type="text/javascript">
$(function () {
var table = $('[id*=gvCustomers]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
"responsive": true,
"sPaginationType": "full_numbers",
"bPaginate": true,
"bSort": true,
"iDisplayLength": 2,
"columnDefs": [{
"targets": -1,
"data": null,
"defaultContent": "<input id='btnEdit' class='btn btn-success' value='View' />"
}]
});
$('#gvCustomers tbody').on('click', '[id*=btnEdit]', function () {
var data = table.row($(this).parents('tr')).data();
var account = data[0];
alert("Account : " + account);
});
});
</script>
<%--<script type="text/javascript">
$(function () {
$.ajax({
type: "POST",
url: "CS.aspx/GetCustomers",
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert(response.d);
},
error: function (response) {
alert(response.d);
}
});
});
function OnSuccess(response) {
$("[id*=gvCustomers]").DataTable(
{
bLengthChange: true,
lengthMenu: [[10, 20, -1], [10, 20, "All"]],
bFilter: true,
bSort: true,
bPaginate: true,
data: response.d,
columns: [{ 'data': 'Account' },
{ 'data': 'Name', "autoWidth": true },
{ 'data': 'Classr' },
{ 'data': 'Stream' },
{ 'data': 'STDTYPE' },
{ 'data': 'SEX' },
{ 'data': 'Colour' },
{ 'data': 'ACNOS' }
]
});
};
</script>--%>
Namespaces
C#
using System.Data.SqlClient;
using System.Configuration;
VB.Net
Imports System.Data.SqlClient
Imports System.Configuration
Code
C#
protected void Page_Load(object sender, System.EventArgs e)
{
if (!this.IsPostBack)
{
gvCustomers.DataSource = GetCustomers();
gvCustomers.DataBind();
}
}
public class Customer
{
public string Account { get; set; }
public string Name { get; set; }
public string Classr { get; set; }
public string Stream { get; set; }
public string STDTYPE { get; set; }
public string SEX { get; set; }
public string Colour { get; set; }
public string ACNOS { get; set; }
}
public static List<Customer> GetCustomers()
{
List<Customer> customers = new List<Customer>();
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("SELECT admno, Name, Class, Stream,SEX,ACNOS,STDTYPE,House FROM Test_Students", con))
{
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
customers.Add(new Customer()
{
Account = sdr["admno"].ToString(),
Name = sdr["Name"].ToString(),
Classr = sdr["Class"].ToString(),
Stream = sdr["Stream"].ToString(),
SEX = sdr["SEX"].ToString(),
STDTYPE = sdr["STDTYPE"].ToString(),
ACNOS = sdr["ACNOS"].ToString(),
Colour = sdr["House"].ToString()
});
}
con.Close();
}
}
return customers;
}
VB.Net
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Me.IsPostBack Then
gvCustomers.DataSource = GetCustomers()
gvCustomers.DataBind()
End If
End Sub
Public Class Customer
Public Property Account As String
Public Property Name As String
Public Property Classr As String
Public Property Stream As String
Public Property STDTYPE As String
Public Property SEX As String
Public Property Colour As String
Public Property ACNOS As String
End Class
Public Shared Function GetCustomers() As List(Of Customer)
Dim customers As List(Of Customer) = New List(Of Customer)()
Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using con As SqlConnection = New SqlConnection(constr)
Using cmd As SqlCommand = New SqlCommand("SELECT admno, Name, Class, Stream,SEX,ACNOS,STDTYPE,House FROM Test_Students", con)
con.Open()
Using sdr As SqlDataReader = cmd.ExecuteReader()
While sdr.Read()
customers.Add(New Customer() With {
.Account = sdr("admno").ToString(),
.Name = sdr("Name").ToString(),
.Classr = sdr("Class").ToString(),
.Stream = sdr("Stream").ToString(),
.SEX = sdr("SEX").ToString(),
.STDTYPE = sdr("STDTYPE").ToString(),
.ACNOS = sdr("ACNOS").ToString(),
.Colour = sdr("House").ToString()
})
End While
End Using
con.Close()
End Using
End Using
Return customers
End Function
Screenshot