复选框在DataGrid中的使用

原创 2004年08月29日 13:59:00

   <ASP:DATAGRID id="MyDataGrid" runat="server" Width="667px" Font-Size="10pt" AutoGenerateColumns="False"
    HeaderStyle-BackColor="darkred" HeaderStyle-ForeColor="white" Height="160px">
     <HeaderStyle ForeColor="White" BackColor="DarkRed"></HeaderStyle>
     <Columns>
      <asp:TemplateColumn>
       <HeaderTemplate>
       <input type="checkbox" name="allbox" onclick="SelectAll();"/>

       <font face="Webdings" color="white" size="4">选择</font>
       <HeaderTemplate>
       <ItemTemplate>
        <asp:CheckBox ID="SelectCheckBox" onclick="javascript:Select(this);" runat="server" />
       </ItemTemplate>
      </asp:TemplateColumn>
     <asp:BoundColumn DataField="NAME" HeaderText="文字说明"></asp:BoundColumn>

     </Columns>
    </ASP:DATAGRID>+br>

 

相关的js文件

//CheckBox全选
function SelectAll(){
var frm=document.Form1;
for (var i=0;i<frm.elements.length;i++)
{
var e=frm.elements[i];
if ((e.name != 'allbox') && (e.type=='checkbox'))
{
e.checked=frm.allbox.checked;
if (frm.allbox.checked)
{
hL(e);
}//endif
else
{
dL(e);
}//endelse

}//endif
}//endfor
}


//CheckBox选择项
function Select(CB)
{
var frm=document.Form1;
if (CB.checked)
hL(CB);
else
dL(CB);

var TB=TO=0;
for (var i=0;i<frm.elements.length;i++)
{
var e=frm.elements[i];
if ((e.name != 'allbox') && (e.type=='checkbox'))
{
TB++;
if (e.checked)
TO++;
}
}
frm.allbox.checked=(TO==TB)?true:false;
}

//以下两个用于控制被选择的行的颜色显示的变化 需要相关的css文件配合
function hL(E){ 
while (E.tagName!="TR")
{E=E.parentElement;}
E.className="H";
}

function dL(E){
while (E.tagName!="TR")
{E=E.parentElement;}
E.className="";
}

 

//相关css文件如下:

.{
 font-size : 12pt;
}
.H{
/*用于select*/
 font-size : 12pt;
        /*cursor:hand;*/
        color:#3366ff;
        background : #FFF3F3;
 border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px;
}

easyui datagrid组件 单击行 让他不选中 只有单击checkbox的时候才选中

第一:问题如图 如上图,当单击行的时候,datagrid会默认选中该行。 在easyui的api中,有两个参数: 1、checkOnSelect 如果为true,当用户点击行的时候该复选框就...
  • qq_35572020
  • qq_35572020
  • 2016年11月18日 16:42
  • 4947

easyui datagrid 创建带复选框表格(2)

1.源码 创建带复选框的datagrid
  • yb305
  • yb305
  • 2017年01月12日 14:48
  • 2346

WPF中DataGrid 添加checkbox实现全选、多选

在机房合作项目中,有一个窗体是这样子的               简单介绍一下:就是通过查询出正在上机的学生,可以通过勾选前面的checkbox,选中该行,然后可以进行部分下机和全部下机。如...
  • kwy15732621629
  • kwy15732621629
  • 2016年07月26日 14:41
  • 6752

flex DataGrid复选框源码

  • 2011年09月10日 18:19
  • 3KB
  • 下载

flex带复选框的datagrid

  • 2011年12月15日 22:02
  • 346KB
  • 下载

DataGrid控件下拉列表框、日历时间和复选框演示

  • 2007年11月13日 10:59
  • 32KB
  • 下载

easyui datagrid 创建带复选框表格(2)

1.源码 创建带复选框的datagrid
  • yb305
  • yb305
  • 2017年01月12日 14:48
  • 2346

flex在DataGrid中添加checkbox复选框,并获取选中的值

flex在DataGrid中添加checkbox复选框,并获取选中的值 1、界面:注册事件,并获取子窗体的值 //选择专题区域 private  var ztqy:DBPJZTQY = null; p...
  • ml5271169588
  • ml5271169588
  • 2013年09月15日 15:42
  • 6006

带有复选框的数据网格DataGrid

在数据网格(DataGrid)每一行有了复选框可以用来进行批量删除工作)
  • xjh2011xjh
  • xjh2011xjh
  • 2014年09月25日 14:57
  • 548

为Flex Datagrid添加复选框列

本文转载自:http://www.riafan.com/add-checkbox-column-for-flex-datagrid/ 以下为正文内容: 如果设置MX DataGrid的...
  • xjh2011xjh
  • xjh2011xjh
  • 2015年01月11日 01:09
  • 718
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:复选框在DataGrid中的使用
举报原因:
原因补充:

(最多只允许输入30个字)