$(document).ready(function(){
$("#<%=GridView1.ClientID%>
tr:even").css("background-color","Lightgrey");
$("#<%=GridView1.ClientID%>
tr:odd").css("background-color","Green");
});
Wednesday, 23 May 2012
Tuesday, 22 May 2012
Changing GridView row Color on mouseover using jQuery
Step 1: Download Jquery file from Here:
Step 2: Add the Jquery file and write Jquery as Given Below:
Step 2: Add the Jquery file and write Jquery as Given Below:
<script type="text/javascript"
src="jquery-1.3.2.js"></script>
<head runat="server">
<title>Grid View</title>
<script type ="text/javascript">
$(document).ready(function()
{
$("#<%=GridView1.ClientID%> tr").hover(function()
{
$(this).css("background-color",
"Lightgrey");
},
function()
{
$(this).css("background-color",
"#ffffff");
});
});s
</script>
Customise AJAX Using JQuery
Step 1: Download Jquery file from Here
Step 2 : Add the Given Below Code in Your Source Page Named Mydata.aspx.
Step 2 : Add the Given Below Code in Your Source Page Named Mydata.aspx.
<%@ Page Language="C#"
AutoEventWireup="true"
CodeFile="Mydata.aspx.cs"
Inherits="Mydata"
%>
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled
Page</title>
<script type="text/javascript"
src="jquery-1.3.2.js"></script>
<script type ="text/javascript">
$(document).ready(function(){
$("#Button1").click(function(){
$.ajax({url:"AjaxServer.aspx?id=1",success:function(result){
$("#GridData").html(result);
}});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick
="FetchDGContents();"/>
</ContentTemplate>
</asp:UpdatePanel>
<div id =
"GridData">
</div>
</div>
</form>
</body>
</html>
Step 3: Add a page named AjaxServer.aspx
Step 4: Write Code in AjaxServer.aspx.cs
public partial class AjaxServer : System.Web.UI.Page
{
SqlConnection
cn = new SqlConnection(@"Your Connection String");
protected void Page_Load(object
sender, EventArgs e)
{
string
id = Request.QueryString["id"];
//string
XmlString;
SqlDataAdapter
da = new SqlDataAdapter("select * from Emp",cn);
DataSet
ds = new DataSet();
da.Fill(ds, "XmlTable");
ConvertHTML(ds);
}
public void ConvertHTML(DataSet
ds)
{
using (StringWriter
sw = new StringWriter())
{
using
(HtmlTextWriter htw = new HtmlTextWriter(sw))
{
string
srtMsg;
//
instantiate a datagrid
DataGrid
dg = new DataGrid();
dg.DataSource = ds.Tables[0];
dg.HeaderStyle.BackColor =
System.Drawing.Color.Gray;
dg.HeaderStyle.Font.Name = "Tahoma";
dg.HeaderStyle.Font.Size = 12;
dg.HeaderStyle.ForeColor =
System.Drawing.Color.White;
dg.DataBind();
dg.RenderControl(htw);
srtMsg = sw.ToString();
ds.Clear();
Response.Clear();
Response.ContentType = "text/HTML";
Response.Write(srtMsg);
Response.End();
}
}
}
}
Monday, 21 May 2012
How to Show Dataset or DataGrid using Customise AJAX
Javascript:
<script type ="text/javascript">
var
AjaxServerPageName = "AjaxServer.aspx?id=1";
function
CreateXmlReq()
{
try
{
XmlReq = new
ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
XmlReq = new
ActiveXObject("Microsoft.XMLHTTP");
}
catch(oc)
{
XmlReq = null;
}
}
if(!XmlReq
&& typeof XMLHttpRequest != "undefined")
{
XmlReq = new
XMLHttpRequest();
}
}
function
HandleResponse()
{
if(XmlReq.readyState
== 4)
{
if(XmlReq.status
== 200)
{
// This Line is Very important.
document.getElementById("GridData").innerHTML =
XmlReq.responseText;
}
else
{
alert("There
was a problem retrieving data from the server." );
}
}
}
function
FetchDGContents()
{
var
requestUrl = AjaxServerPageName;
CreateXmlReq();
if(XmlReq)
{
XmlReq.onreadystatechange =
HandleResponse;
XmlReq.open("GET",
requestUrl, true);
XmlReq.send();
}
--------------------------------------------------------------------
Call This Function on AjaxServer.aspx.cs Load Event
public void ConvertHTML(DataSet
ds)
{
using (StringWriter sw = new
StringWriter())
{
using
(HtmlTextWriter htw = new HtmlTextWriter(sw))
{
string
srtMsg;
//
instantiate a datagrid
DataGrid
dg = new DataGrid();
dg.DataSource = ds.Tables[0];
dg.HeaderStyle.BackColor =
System.Drawing.Color.Gray;
dg.HeaderStyle.Font.Name = "Tahoma";
dg.HeaderStyle.Font.Size = 12;
dg.HeaderStyle.ForeColor =
System.Drawing.Color.White;
dg.DataBind();
dg.RenderControl(htw);
srtMsg = sw.ToString();
ds.Clear();
Response.Clear();
Response.ContentType = "text/HTML";
Response.Write(srtMsg);
Response.End();
}
}
}
</script>
Subscribe to:
Posts (Atom)