一段实现DataGrid的“编辑”、“取消”功能脚本，目的是不产生页面刷新

一段实现DataGrid的“编辑”、“取消”功能脚本，目的是不产生页面刷新

<SCRIPT language="javascript">

var selectRow="";

var selectObject;

function EditCell(thisObject,type)

{

var id = thisObject.id;

var buttonID="Button"+type;

var row=id.replace(buttonID,"");

if(type==1&&selectRow.length>0&&selectObject!=null)

{

EditRow(selectRow,2,selectObject);

selectRow="";

}

if(type==1){selectRow=row;selectObject=thisObject;}else{selectRow="";selectObject=null;}

EditRow(row,type,thisObject);

}

function EditRow(row,type,thisObject)

{

var visible1="none";

var visible2="inline";

if(type!=1)

{

visible1="inline";

visible2="none";

}

var buttonID="Button"+type;

var style;

var i;

for(i=1;i<8;i++)

{

var name1=row+"Img"+i;

document.all[name1].getAttribute("style").display=visible1;

name1=row+"Text"+i;

var name2=row+"Checkbox"+i;

document.all[name2].getAttribute("style").display=visible2;

if(type!=1)

{

if(document.all[name1].value==1)

document.all[name2].checked=true;

else

document.all[name2].checked=false;

}

}

var tdIndex = thisObject.parentElement.cellIndex;

if(type>1) tdIndex = tdIndex -1;

thisObject.parentElement.parentElement.cells[tdIndex].getAttribute("style").display=visible2;

thisObject.parentElement.colSpan=type;

var name;

name=row+buttonID;

document.all[name].getAttribute("style").display="none";

if(type==1)

{

document.all[name].parentElement.parentElement.getAttribute("style").backgroundColor="LightYellow";

name=row+"Button2";

document.all[name].getAttribute("style").display="inline";

}

else

{

document.all[name].parentElement.parentElement.getAttribute("style").backgroundColor="";

name=row+"Button1";

document.all[name].getAttribute("style").display="inline";

}

}

</SCRIPT>

<asp:datagrid id="GridItem" runat="server" cellPadding="0" BorderStyle="Solid" AutoGenerateColumns="False"

Width="100%" AllowPaging="True">

<SelectedItemStyle BackColor="LightYellow"></SelectedItemStyle>

<EditItemStyle CssClass="tdbg-dark" BackColor="Ivory"></EditItemStyle>

<ItemStyle HorizontalAlign="Center" Height="23px" CssClass="tdbg"></ItemStyle>

<HeaderStyle HorizontalAlign="Center" Height="25px" CssClass="summary-title"></HeaderStyle>

<Columns>

<asp:BoundColumn DataField="id" ReadOnly="True" HeaderText="人员编号">

<HeaderStyle Width="120px"></HeaderStyle>

</asp:BoundColumn>

<asp:BoundColumn ReadOnly="True" HeaderText="姓名">

<HeaderStyle Width="120px"></HeaderStyle>

</asp:BoundColumn>

<asp:TemplateColumn HeaderText="管理权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img1" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox1" style="DISPLAY: none" type="checkbox" runat="server">

<INPUT id="Text1" type="text" runat="server" style="DISPLAY: none">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="查询权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img2" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox2" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox2">

<INPUT id="Text2" type="text" runat="server" style="DISPLAY: none" NAME="Text2">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="录入权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img3" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox3" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox3">

<INPUT id="Text3" type="text" runat="server" style="DISPLAY: none" NAME="Text3">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="修改权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img4" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox4" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox4">

<INPUT id="Text4" type="text" runat="server" style="DISPLAY: none" NAME="Text4">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="删除权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img5" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox5" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox5">

<INPUT id="Text5" type="text" runat="server" style="DISPLAY: none" NAME="Text5">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="导出权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img6" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox6" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox6">

<INPUT id="Text6" type="text" runat="server" style="DISPLAY: none" NAME="Text6">

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="导入权">

<HeaderStyle Width="60px"></HeaderStyle>

<ItemTemplate>

<IMG id="Img7" style="DISPLAY: inline" alt="" src="Images/CheckBoxUnSelect.gif" runat="server"><INPUT id="Checkbox7" style="DISPLAY: none" type="checkbox" runat="server" NAME="Checkbox7">

<INPUT id="Text7" type="text" runat="server" style="DISPLAY: none" NAME="Text7">

</ItemTemplate>

</asp:TemplateColumn>

<asp:ButtonColumn Text="保存" HeaderText="操作" CommandName="cmdSave">

<ItemStyle Font-Size="10pt"></ItemStyle>

</asp:ButtonColumn>

<asp:TemplateColumn>

<ItemTemplate>

<INPUT id="Button1" style="cursor: hand; WIDTH: 35px; COLOR: blue; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline; BORDER-BOTTOM-STYLE: none"

onclick="EditCell(this,1);" type="button" value="编辑" runat="server"><INPUT id="Button2" style="cursor: hand; DISPLAY: none; COLOR: blue; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline; BORDER-BOTTOM-STYLE: none"

onclick="EditCell(this,2);" type="button" value="取消" runat="server">

</ItemTemplate>

</asp:TemplateColumn>

</Columns>

<PagerStyle NextPageText="下一页" PrevPageText="上一页"></PagerStyle>

</asp:datagrid>