请教大家一个客户端 javascript 和asp.net 控件结合的问题

[lobby]

我现在用一个DataGrid 来显示一个查询结果，在这个DataGrid 的第一列是一个CheckBox代表删除当前行（默认为不选），当我把这个CheckBox 勾上，我希望能够通过 javascript 把本行的字体颜色改变（或者加上删除线）

想问问大家是否有这方面的经验？怎么找到这一行和这一行上面的所有文字呢？是通过 parent 来找，还是通过查找对象名字的方法来实现？请教一下大家，谢谢！

[quanke1981]

信誉94.....嗯，是个问问题不给分的

[Bruce_H21]

用Ajax可以

[lobby]

汗...，我问过两问题，都给不了分。。。说有页面错误

[lobby]

行:1095
字符:1
错误:缺少对象
代码:0
URL:http://community.csdn.net/expert/Topicview2.asp?id=4426514

不是我不给分，实在不是我的错啊,,,:( :( :( :( :(

[yilan505]

你去看一下DataGrid转译成html后的代码..再在相应的地方写上javascript代码..
楼主有必要看一下dhtml方面的书...

[fphuang]

<asp:datalist id="score" runat="server" Height="0px" Width="750px">
<HeaderTemplate>
</HeaderTemplate>
<ItemTemplate>
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0">
<tr bgcolor="#FFF7E8" id="chk" height="35" Runat="server">
<td width="30"> </td>
<td width="7%"><div align="Center">
<input type="hidden" id="SelectedID" runat="server" value='<%# DataBinder.Eval(Container.DataItem, "id")%>' NAME="SelectedID"/>
<asp:CheckBox ID="chkExport" onclick="javascript:check_all(this);" Runat="server" />
</div>
</td>
<td width="20%" rowspan="1" class="h12"><%# CutString(DataBinder.Eval(Container.DataItem,"Title").ToString(),27) %>
</td>
<td width="100" rowspan="1" class="h12"> </td>
<td width="30%" rowspan="1" class="h12">
</td>
<td width="150" rowspan="1" class="h12"> </td>
<td width="200" rowspan="1" class="h12"><%# DataBinder.Eval(Container.DataItem,"L_time","{0:D}").ToString() %>
</td>
<td width="10" rowspan="1" class="h12"></td>
</tr>
</table>
</ItemTemplate>
<AlternatingItemTemplate>
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0">
<tr id="chk" height="35" bgcolor="#f6f6f6" Runat="server">
<td width="30"> </td>
<td width="7%"><div align="Center">
<input type="hidden" id="SelectedID" runat="server" value='<%# DataBinder.Eval(Container.DataItem, "id")%>' NAME="SelectedID"/>
<asp:CheckBox ID="chkExport" onclick="javascript:check_all(this);" Runat="server" />
</div>
</td>
<td width="20%" rowspan="1" class="h12"><%# CutString(DataBinder.Eval(Container.DataItem,"Title").ToString(),27) %>
</td>
<td width="100" rowspan="1" class="h12"> </td>
<td width="30%" rowspan="1" class="h12">
</td>
<td width="150" rowspan="1" class="h12"> </td>
<td width="200" rowspan="1" class="h12"><%# DataBinder.Eval(Container.DataItem,"L_time","{0:D}").ToString() %>
</td>
<td width="10" rowspan="1" class="h12"></td>
</tr>
</table>
</AlternatingItemTemplate>
</asp:datalist>

[fphuang]

<script language="javascript">
function check_all(box)
{

var trTag =document.getElementById(box.id);

var all=document.getElementById("form1")
var checks=all.getElementsByTagName("input");

for(var i=0;i<checks.length;i++)
{
if (checks[i].type=="checkbox")//上边还有点问题 注意这是==
{
// if(document.getElementById(checks[i].id).checked && document.getElementById(checks[i].id)!=trTag)
if(checks[i].id!=trTag.id)
{
document.getElementById(checks[i].id).checked=false;
}

clickcompareBox(checks[i]);
}


}
}

</script>
<SCRIPT language="javascript">
bgColor = "FEEEE0";


function clickcompareBox(box) {

if(box.checked){

if(box.id.length==21)
{
var trTag =document.getElementById(box.id.substring(0,15));
// var trTag=score__ctl1_chk;
trTag.bgColor=bgColor;
// score__ctl1_chk.bgColor=bgColor;
// alert(trTag);
//alert(trTag.length);
}
else
if(box.id.length==22)
{
var trTag =document.getElementById(box.id.substring(0,16));
trTag.bgColor=bgColor;
}
else
if(box.id.length==23)
{
var trTag =document.getElementById(box.id.substring(0,17));
trTag.bgColor=bgColor;
}

}
else
{
if(box.id.length==21)
{
var trTag =document.getElementById(box.id.substring(0,15));
var countId = box.id.substring(10,11);
}
else
if(box.id.length==22)
{
var trTag =document.getElementById(box.id.substring(0,16));
var countId = box.id.substring(10,12);
}
else
if(box.id.length==23)
{
var trTag =document.getElementById(box.id.substring(0,17));
var countId = box.id.substring(10,13);
}
if(countId%2 != 0){
trTag.bgColor="ffffff";
}else{
trTag.bgColor="F6F6F6";
}
}
}


</SCRIPT>

[fphuang]

偶写的这个是datalist改变颜色的,不过和datagrid应该差不多,剩下的你自己放在自己的程序中吧

[以专业开发人员为伍]

什么什么？改变一行颜色至于这样让我从头看到尾死了几万个脑细胞啊？何况Datalist的那个例子用在DataGrid上是两回事。

改变颜色通常这样写(可能有语法错)：

Protected Override Sub OnItemDataBound(ByVal e As DataGridItemEventArgs) _
handle Datagrid.OnItemDataBound
static s="if(this.checked)document.all['{0}'].style.backgroundcolor"+ _
"='F6F6F6';else document.all['{0}'].style.backgroundcolor='FFFFFF';"
select e.item.itemtyle
case listitemtype.item,listitemtype.AlternatingItem
dim ck as checkbox=e.findcontrol("checkDelete")
ck.attribute.add("onclick",string.format(s,e.item.clientID))
end select
End Sub

看懂了，应该是asp.net入门了。这不需要全用javascript解决。

[以专业开发人员为伍]

e.findcontrol("checkDelete") --> e.item.findcontrol("checkDelete")

[ywcyj]

ajax技术就是js和asp.net的结合

[lobby]

我看了 fphuang 的代码并参考着做出来了，不过我的应用要复杂一些，提交时要根据每行不同的颜色来决定这一行是 delete 还是 update 还是 insert。

不过发现一个问题就是列颜色在页面提交后是不能保存的，所以我只好用了textbox 来保存状态值(把 width设成1 看不见)

如果有人有兴趣我可以共享我的代码。

sp1234 的方法确实比较巧妙，代码量少，但最终也是通过js 实现，而且我觉得这样会使得页面的体积大呀（每行重复的），呵呵

谢谢各位

[lobby]

还是给不了分 :(