Hi friends,in this article I will explain about JQuery:Select Multiple records in GridView with Ctrl Key in ASP.NET using C#/VB.NET.
I already explained in the previous articles about JQuery:Remove Multiple Rows in GridView With Ctrl Key in ASP.NET using C#/VB.NET, Move Gridview Rows Up and Down by using JQuery in ASP.NET using C#.NET/VB.NET and How to Validate Date in Different(Any) formats using C#.NET/VB.NET
Write the below code in the .aspx page
ASP.NET: Previous Article>>JQuery:get GridView Cell Data
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JQuery:Select
Multiple records in GridView with Ctrl Key in ASP.NET using C#/VB.NET</title>
<style type="text/css">
.selected
{
color: Red;
}
</style>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("#gv_GetCellData tr td").each(function (index) {
$(this).attr("id",
"td" + index);
});
});
$(document).ready(function () {
var isTrue = 0;
var x = "";
var ids = [];
$("#gv_GetCellData tr:has(td)").click(function (e) {
var string1 = "";
$(this).css("cursor",
"pointer");
if (e.ctrlKey) {
var selTD = $(e.target).closest("td");
if ($(e.target).closest("td").attr("class") != "selected")
{
selTD.addClass("selected");
$("#lblSelected").append(selTD.text() + " ");
}
else {
selTD.removeAttr("class");
string1 = $("#lblSelected").text();
$("#lblSelected").empty();
string1 = string1.replace(selTD.text(), "
");
$("#lblSelected").append(string1);
}
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="gv_GetCellData"
runat="server"
BackColor="White"
BorderColor="#CC9966"
BorderStyle="Solid"
BorderWidth="1px"
CellPadding="4"
Font-Names="Georgia"
Font-Size="Small"
Width="375px">
<FooterStyle BackColor="Tan"
/>
<AlternatingRowStyle
BackColor="#E6E6E1"
/>
<FooterStyle BackColor="#FFFFCC"
ForeColor="#330099"
/>
<HeaderStyle BackColor="#990000"
Font-Bold="True"
ForeColor="#FFFFCC"
/>
</asp:GridView>
</div>
<div>
Selected cell value is
:
<asp:Label ID="lblSelected"
runat="server"
ForeColor="Red"></asp:Label></div>
</form>
</body>
</html>
|
In C#:
using System.Data;
public partial class SelectMultipleCellWithCtrl : System.Web.UI.Page
{
protected
void Page_Load(object
sender, EventArgs e)
{
if (!IsPostBack)
{
gv_GetCellData.DataSource
= GetData();
gv_GetCellData.DataBind();
}
}
protected
DataTable GetData()
{
DataTable dt = new
DataTable();
dt.Columns.AddRange(new DataColumn[2]
{ new DataColumn("StudentID"), new
DataColumn("StudentName")
});
dt.Rows.Add("1", "Kishore");
dt.Rows.Add("2", "SaiR");
dt.Rows.Add("3", "Satyam");
dt.Rows.Add("4", "Raghav");
dt.Rows.Add("5", "Nag");
dt.Rows.Add("6", "Satya");
return dt;
}
}
|
In VB.NET:
Imports System.Data
Partial Public Class SelectMultipleCellWithCtrl
Inherits
System.Web.UI.Page
Protected
Sub Page_Load(ByVal
sender As Object,
ByVal e As EventArgs)
If Not IsPostBack Then
gv_GetCellData.DataSource = GetData()
gv_GetCellData.DataBind()
End If
End
Sub
Protected
Function GetData() As
DataTable
Dim dt As New DataTable()
dt.Columns.AddRange(New DataColumn(1)
{New DataColumn("StudentID"), New
DataColumn("StudentName")})
dt.Rows.Add("1", "Kishore")
dt.Rows.Add("2", "SaiR")
dt.Rows.Add("3", "Satyam")
dt.Rows.Add("4", "Raghav")
dt.Rows.Add("5", "Nag")
dt.Rows.Add("6", "Satya")
Return dt
End
Function
End Class
|
The output of the above page as shown in below.
You can download the code by clicking on the below Download image.
Previous Article>>JQuery:get GridView Cell Data
"If you like my blog or articles, you can appreciate by leaving your comments or Liking my Facebook pageAspdotnet-kishore, following on Google+ Aspdotnet-Kishore, Twitter on AspdotnetKishore, Linked in Aspdotnet-Kishore, stumbling my posts on stumble upon and subscribing on RSSfeed Aspdotnet-Kishore for free updates directly to your Email inbox . Watch my blog for more articles."
No comments:
Post a Comment