IDC资讯中心
在网络开发中，经常遇到需要使用asp.net与javascript联合进行控制的情况。在本篇中，将使用datagrid进行数据绑定，使用javascript控制当选中其中的checkbox时，该行颜色改变。
首先，在页面中创建一个datagrid控件，并设置其模板。
<asp:datagrid id=”datagrid1″ runat=”server” autogeneratecolumns=”false”>
<columns>
<asp:templatecolumn>
<itemtemplate>
<asp:checkbox id=”checkbox1″ runat =”server”></asp:checkbox>
<asp:label runat=”server” text=<%# databinder.eval(container, “dataitem”) %>></asp:label>
</itemtemplate>
</asp:templatecolumn>
</columns>
</asp:datagrid>
第二，在页面中的<head></head>中编写javascript脚本函数，进行checkbox的判断和颜色改变的控制。
<script>
function checkme(obj,tr){
if(obj.checked)
tr.style.backgroundcolor=blue;
else
tr.style.backgroundcolor=;
}
</script>
第三，在page_load事件中为datagrid绑定数据，并关联checkbox的javascript脚本。
private void page_load(object sender, system.eventargs e)
{
// put user code to initialize the page here
if(!ispostback)
{
databind();
}
}
private void databind()
{
arraylist arr=new arraylist();
arr.add(“新闻综合”);
arr.add(“综艺”);
arr.add(“电影”);
arr.add(“教育”);
arr.add(“戏剧”);
arr.add(“军事”);
arr.add(“体育”);
datagrid1.datasource=arr;
datagrid1.databind();
int i;
for(i=0;i<datagrid1.items.count;i++){
checkbox cb;
cb=(checkbox)datagrid1.items[i].findcontrol(“checkbox1”);
datagrid1.items[i].attributes.add(“id”,”tr” + i.tostring());
cb.attributes.add(“onclick”,”checkme(this,tr” + i.tostring() + “);”);
}
}
第四，完成之后运行程序。程序运行后，会在datagrid控件的每行前显示一个checkbox控件，选择该控件，该行背景颜色变蓝色，取消选择，该行颜色恢复初始状态。
