Hi SajidHussa,
Check the below example.
Database
For this example I have used of Northwind database that you can download using the link given below.
Download Northwind Database
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.buttonload
{
background-color: #4CAF50; /* Green background */
border: none; /* Remove borders */
color: white; /* White text */
padding: 8px 10px; /* Some padding */
font-size: 15px /* Set a font size */;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script type="text/javascript">
$(function () {
$('[id*=btnLoader]').hide();
$('[id*=btnSubmit]').on("click", function () {
setTimeout(function () {
$('[id*=btnSubmit]').hide();
$('[id*=btnLoader]').show();
}, 200);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
Country:
<asp:DropDownList ID="ddlCountries" runat="server">
<asp:ListItem Text="All" Value="" />
<asp:ListItem Text="USA" Value="USA" />
<asp:ListItem Text="Brazil" Value="Brazil" />
<asp:ListItem Text="France" Value="France" />
<asp:ListItem Text="Germany" Value="Germany" />
</asp:DropDownList>
<asp:Button ID="btnSubmit" runat="server" Text="Load Customers" OnClick="btnSubmit_Click"
class="buttonload"></asp:Button>
<button class="buttonload" id="btnLoader" style="display: none;" disabled>
<i class="fa fa-spinner fa-spin"></i>Loading
</button>
<hr />
<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="CustomerId" HeaderText="Customer Id" />
<asp:BoundField DataField="ContactName" HeaderText="Contact Name" />
<asp:BoundField DataField="City" HeaderText="City" />
</Columns>
</asp:GridView>
</form>
</body>
</html>
Namespaces
C#
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
VB.Net
Imports System.Configuration
Imports System.Data
Imports System.Data.SqlClient
Code
C#
protected void btnSubmit_Click(object sender, EventArgs e)
{
// Add Fake Delay to simulate long running process.
System.Threading.Thread.Sleep(1000);
LoadCustomers();
}
private void LoadCustomers()
{
string strConnString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
string query = "SELECT * FROM Customers WHERE Country = @Country OR @Country = ''";
SqlCommand cmd = new SqlCommand(query);
cmd.Parameters.AddWithValue("@Country", ddlCountries.SelectedItem.Value);
using (SqlConnection con = new SqlConnection(strConnString))
{
using (SqlDataAdapter sda = new SqlDataAdapter())
{
cmd.Connection = con;
sda.SelectCommand = cmd;
using (DataSet ds = new DataSet())
{
sda.Fill(ds, "Customers");
gvCustomers.DataSource = ds;
gvCustomers.DataBind();
}
}
}
}
VB.Net
Protected Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs)
' Add Fake Delay to simulate long running process.
System.Threading.Thread.Sleep(1000)
LoadCustomers()
End Sub
Private Sub LoadCustomers()
Dim strConnString As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Dim query As String = "SELECT * FROM Customers WHERE Country = @Country OR @Country = ''"
Dim cmd As SqlCommand = New SqlCommand(query)
cmd.Parameters.AddWithValue("@Country", ddlCountries.SelectedItem.Value)
Dim con As SqlConnection = New SqlConnection(strConnString)
Dim sda As SqlDataAdapter = New SqlDataAdapter
cmd.Connection = con
sda.SelectCommand = cmd
Dim ds As DataSet = New DataSet
sda.Fill(ds, "Customers")
gvCustomers.DataSource = ds
gvCustomers.DataBind()
End Sub
Screenshot
