Asp DataGrid with Editable cell with out Postback using Javascript

This is created for one of my friend. he want's in his project. so i thought of sharing with everyone am writing in my blog.

step 1:

create asp grid control with binding dummy value.

step 2:

<asp:GridView ID="grView" runat="server" AutoGenerateColumns="false"

onprerender="grView_PreRender">

<Columns>

<asp:TemplateField>

<ItemTemplate>

<div id="lblDiv" runat="server">

<asp:Label ID="lblID" runat="server" Text='<%# Eval("Empid") %>'></asp:Label>

</div>

<div id="txtDiv" style="display:none" runat="server">

<asp:TextBox ID="txtID" runat="server" Text='<%# Eval("Empid") %>'></asp:TextBox>

</div>

</ItemTemplate>

</asp:TemplateField>

</Columns>

</asp:GridView>

step 3:

DataTable DT = new DataTable();

DataColumn dc1 = new DataColumn("Empid");

DataColumn dc2 = new DataColumn("Empname");

DataColumn dc3 = new DataColumn("EmpSalary");

DataColumn dc4 = new DataColumn("EmpAddress");

DT.Columns.Add(dc1);

DT.Columns.Add(dc2);

DT.Columns.Add(dc3);

DT.Columns.Add(dc4);

DataRow DR;

for (int i = 0; i <>

{

DR = DT.NewRow();

DR["Empid"] = i.ToString();

DR["Empname"] = "Bala";

DR["Empid"] = "Salary";

DR["Empid"] = "Address";

DT.Rows.Add(DR);

}

grView.DataSource = DT;

grView.DataBind();

step 4:

Calling javascript for the cell through.

protected void grView_PreRender(object sender, EventArgs e)

{

foreach (GridViewRow dr in grView.Rows)

{

Label lbl = (Label)dr.FindControl("lblID");

lbl.ID = "lblID";

lbl.Attributes.Add("onclick", "javascript:lbltoTxt(this)");

TextBox txt = (TextBox)dr.FindControl("txtID");

txt.Attributes.Add("onblur", "javascript:txttoLbl(this)");

}

}

Step 5:

<script language="javascript">

function lbltoTxt(obj)

{

var divtxtObj = document.getElementById(obj.id.replace('lblID', 'txtDiv'));

var txtObj = document.getElementById(obj.id.replace('lblID', 'txtID'));

if (divtxtObj != null)

{

if (divtxtObj.style.display == "none")

{

divtxtObj.style.display = "block";

txtObj.focus();

}

}

var divlblObj = document.getElementById(obj.id.replace('lblID', 'lblDiv'));

if (divlblObj != null)

{

if (divlblObj != null)

{

divlblObj.style.display = "none"

}

}

}

function txttoLbl(obj) {

var divlblObj = document.getElementById(obj.id.replace('txtID', 'lblDiv'));

var lblObj = document.getElementById(obj.id.replace('txtID', 'lblID'));

if (divlblObj != null) {

if (divlblObj.style.display == "none") {

divlblObj.style.display = "block";

lblObj.innerText = obj.value;

}

}

var divtxtObj = document.getElementById(obj.id.replace('txtID', 'txtDiv'));

if (divtxtObj != null) {

if (divtxtObj != null) {

divtxtObj.style.display = "none"

}

}

}

</script>

What is the use of "Canvas" Controls?????

Canvas is one of the layout control for the silverlight. This is just like container will contain the controls.

In silverlight wright now we have three layout controls. The layout types are as given below.

1)Canvas.

2)StackPanel.

3)Grid.

My first feel with Silverlight

first of all have to say thanks to microsoft to developing this kind of product.

I have started learning about the silverlight. it's nearly nice to see in the browser with rich user experience. Really interesting to learn all new controls and new way of approuch. This is really very good treat for dotnet developer.

Let's start learning with next generation technology.

javascript listbox problem

just thought of sharing this info with everyone. I am writing in my blog.

Every one no about list box control in the asp.net controls. I have tried to write javascript for selected value when enabled the multiselection for the control. In this situation am unable to get the selected value index correctly. it's coming differentyly.. post me if you know the answer..

To fire onclick event automatically on page load using Javascript

if(navigator.appName !="Microsoft Internet Explorer")

{
HTMLElement.prototype.click = function()

{
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}

}

Avoid Special Character using Javascript with Regular Expression

javascript validation for special charcter.

function checkSpecial(obj,objEvent)

{

var specialChar = "^[A-Za-z0-9_]+$" //regular expression defining a 5 digit number

var objVal = obj.value;

var objVallen = obj.value.length;

if (objVal != "")

{

if (objVal.search(specialChar) == -1) //if match failed

{

if (objEvent == "keyup") {

if (objVallen > 1) {

obj.value = objVal.substring(0, parseInt(objVallen) - 1);

}

else {

obj.value = "";

}

}

else {

obj.value = "";

}

alert("Invalid character");

obj.focus();

}

}

}