• javascript实现datagrid客户端checkbox列的全选,反选


    最简格式:这是一个偷巧的方法,但不通用。前提是这个页面只有一个datagrid,且只有datagrid中有checkbox;这个就比较方便。主要思路就是搜索出整个页面的checkbox,将它们全部选中或反选。
    // 全选
    function allCheck()
    {
    for (var i=0;i<Form1.elements.length;i++)
    {
    var e=Form1.elements[i];
    if (e.type=='checkbox')
    e.checked=true;
    }

    }
    //反选
    function revCheck()
    {
    for (var i=0;i<Form1.elements.length;i++)
    {
    var e=Form1.elements[i];
    if (e.type=='checkbox')
    e.checked=!e.checked;
    }



    通用简单格式
    因为asp.net页面中生成datagrid中的checkbox,他的ID是要改变的,所以我们寻找它们的规律,就可以准确的找到这个控件,从而进行全选和反选及选中的操作,
     参数说明:
    prefix:前缀;s:选择框ID;chk:选择框的ID;


    function getObj( objID )
    {
     return document.getElementById( objID );
    }

    // 全选
    function _SelectAll( prefix,s,chk )
    {
     var oArr = _GetColl( prefix,s,chk );
     for( var o in oArr )
     {
      oArr[o].checked = true;
     }
    }
    // 反选
    function _RevSelect( prefix,s,chk )
    {
     var oArr = _GetColl( prefix,s,chk );
     for( var o in oArr )
     {
      oArr[o].checked = !oArr[o].checked;
     }
    }

    // 获值
    function _GetColl( prefix,s,chk )
    {
     var i = s;
     var oArr = new Array();
     while( true)
     {
      var o = getObj( prefix + '__ctl' + i + '_' + chk);
      if( o != null )
      {
       oArr.push( o );
      }
      else
      {
       break;
      }
      i++;
     }
     
     return oArr;
    }
    // 检查是否选中
    function _CheckSelect( prefix,s,chk )
    {
     var oArr = _GetColl( prefix,s,chk );
     for( var o in oArr )
     {
      if( oArr[o].checked)
      {
       return true;
      }
     }
     return false;
     
    }

    推荐通用详细格式:http://www.cnblogs.com/ghd258/archive/2005/11/07/270449.html#Post
    /* 分页
      2    参数说明:
      3    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
      4    
      5    使用方法:
      6    if(e.Item.ItemType == ListItemType.Header)
      7    {
      8        ((CheckBox)e.Item.Cells[1].FindControl("chkAll")).Attributes.Add("onclick","CheckAll('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
      9    }
     10*/

     11function CheckAll(prefix,chkAll,chkSingle)
     12{
     13    var indexChkAll;
     14    if(prefix.length != 0)
     15    {
     16        indexChkAll        = prefix + "__ctl2_" + chkAll;
     17    }

     18    else
     19    {
     20        indexChkAll        = chkAll;
     21    }

     22    var objChkAll = document.getElementById(indexChkAll);
     23    var tempObj;
     24    for(var i=0;i<document.forms[0].elements.length;i++)
     25    {    
     26        tempObj = document.forms[0].elements[i];
     27        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
     28        {
     29            tempObj.checked = objChkAll.checked;
     30        }

     31    }

     32}

     33/* 分页
     34    参数说明:
     35    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
     36    
     37    使用方法:
     38    if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
     39    {
     40        ((CheckBox)e.Item.Cells[1].FindControl("chkSingle")).Attributes.Add("onclick","CheckSingle('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
     41    }
     42*/

     43function CheckSingle(prefix,chkAll,chkSingle)
     44{
     45    var indexChkAll;
     46    if(prefix.length != 0)
     47    {
     48        indexChkAll        = prefix + "__ctl2_" + chkAll;
     49    }

     50    else
     51    {
     52        indexChkAll        = chkAll;
     53    }

     54    var objChkAll = document.getElementById(indexChkAll);
     55    var tempObj;
     56    var allCount    = 0;
     57    var checkCount    = 0;
     58    for(var i=0;i<document.forms[0].elements.length;i++)
     59    {    
     60        tempObj = document.forms[0].elements[i];
     61        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
     62        {
     63            if(tempObj.checked)
     64            {
     65                checkCount++;
     66            }

     67            else
     68            {
     69                objChkAll.checked = false;
     70                //break;
     71            }

     72            allCount++;
     73        }

     74    }

     75    if(checkCount != allCount)
     76    {
     77        objChkAll.checked = false;
     78    }

     79    else
     80    {
     81        if(allCount != 0)
     82        {
     83            objChkAll.checked = true;
     84        }

     85    }

     86}

     87/*
     88    参数说明:
     89    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
     90    type:1【全选】,2【反选】,3【取消】
     91    
     92    使用方法:
     93    this.btnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',1);");
     94    this.btnUnSelectAll.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',2);");
     95    this.btnCancelSelect.Attributes.Add("onClick","CheckType('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle',3);");
     96*/

     97function CheckType(prefix,chkAll,chkSingle,type)
     98{
     99    var indexChkAll;
    100    if(prefix.length != 0)
    101    {
    102        indexChkAll        = prefix + "__ctl2_" + chkAll;
    103    }

    104    else
    105    {
    106        indexChkAll        = chkAll;
    107    }

    108    var objChkAll = document.getElementById(indexChkAll);
    109    var tempObj;
    110    var allCount    = 0;
    111    var checkCount    = 0;
    112    for(var i=0;i<document.forms[0].elements.length;i++)
    113    {    
    114        tempObj = document.forms[0].elements[i];
    115        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
    116        {
    117            switch(type)
    118            {
    119                case 1:
    120                    tempObj.checked = true;
    121                    break;
    122                case 2:
    123                    tempObj.checked = !tempObj.checked;
    124                    break;
    125                case 3:
    126                    tempObj.checked = false;
    127                    break;
    128            }

    129            if(tempObj.checked)
    130            {
    131                checkCount++;
    132            }

    133            allCount++;
    134        }

    135    }

    136    if(checkCount != allCount)
    137    {
    138        objChkAll.checked = false;
    139    }

    140    else
    141    {
    142        if(allCount != 0)
    143        {
    144            objChkAll.checked = true;
    145        }

    146    }

    147    window.event.returnValue = false;
    148    return false;
    149}

    150
    151/*
    152    参数说明:
    153    prefix:前缀;chkAll:全选框;chkSingle:单选框ID
    154
    155    使用方法:
    156    this.btnDelete.Attributes.Add("onClick","SubmitCheckBox('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
    157*/

    158function SubmitCheckBox(prefix,chkAll,chkSingle,msg)
    159{
    160    var indexChkAll;
    161    if(prefix.length != 0)
    162    {
    163        indexChkAll        = prefix + "__ctl2_" + chkAll;
    164    }

    165    else
    166    {
    167        indexChkAll        = chkAll;
    168    }

    169    var objChkAll = document.getElementById(indexChkAll);
    170    
    171    var tempObj;
    172    var allCount    = 0;
    173    var checkCount    = 0;
    174    for(var i=0;i<document.forms[0].elements.length;i++)
    175    {    
    176        tempObj = document.forms[0].elements[i];
    177        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
    178        {
    179            if(tempObj.checked)
    180            {
    181                checkCount++;
    182            }

    183            allCount++;
    184        }

    185    }

    186    if(allCount == 0//没有数据
    187    {
    188        window.alert("当前没有" + msg + "可供删除");
    189        window.event.returnValue = false;
    190        return false;
    191    }

    192    else
    193    {
    194        if(checkCount == 0)
    195        {
    196            window.alert("没有选中要删除的" + msg + "");
    197            window.event.returnValue = false;
    198            return false;
    199        }

    200        else
    201        {
    202            //if(window.confirm("确定要删除当前选中的【" + checkCount.toString() + "】项吗?") == false)
    203            if(window.confirm("确定要删除当前选中的" + msg + "吗?"== false)
    204            {
    205                window.event.returnValue = false;
    206                return false;
    207            }

    208        }

    209    }

    210}

  • 相关阅读:
    2021年搭建Java环境最快办法
    teprunner测试平台Django引入pytest完整源码
    teprunner测试平台用例前置模块开发
    JMeter扩展Java请求实现WebRTC本地音视频推流压测脚本
    teprunner测试平台部署到Linux系统Docker
    学习版pytest内核测试平台开发万字长文入门篇
    JUC---02
    JUC——01
    【小白学PyTorch】11 MobileNet详解及PyTorch实现
    【小白学PyTorch】10 pytorch常见运算详解
  • 原文地址:https://www.cnblogs.com/skylaugh/p/596098.html
Copyright © 2020-2023  润新知