Gridview在javascript中有多列复选框选择

时间:2011-11-19 06:47:41

标签: javascript asp.net

我在我的应用程序中使用带有复选框的Gridview。 这是格式: enter image description here

在网格视图中,如果选中标题复选框,那么下面的所有后续chekbox也应该像标题chekbox一样被选中或取消选中。

为此我使用java脚本函数作为。

  function SelectAllFirstRow(ChK, cellno) 
{

         var gv = document.getElementById("ggvPage");
            for (var i = 1; i <= gv.rows.length - 1; i++) {
                var chk1 = gv.rows(i).cells(cellno).firstChild;
                chk1.checked = ChK.checked;
            }
 }

这里: ggvPage 是Gridview。 Chk 是标题Checkbox,cellno类似于1用于查看,2用于添加和.........

它在IE中运行良好,但在Firefox和Chrome中没有。

请建议一些满足我需求的解决方案。

等待有价值的解决方案,

非常感谢, Supriya

2 个答案:

答案 0 :(得分:0)

在jQuery http://api.jquery.com/jQuery.each/

中使用函数.each()

答案 1 :(得分:0)

使用此javascript。这只是一个例子。您可以根据您的要求进行修改

 function SelectAllFirstRow(ChKAdd) 
    {
   if (ChKAdd.checked==false)
     {
      SelectCheck();
     }
    else
   {
    DeselectCheck()
    }
   }


function SelectCheck() {
        var flag;
        for (i = 0; i < document.forms[0].elements.length; i++) {
            elm = document.forms[0].elements[i];

            if ((elm.type == 'checkbox') && (elm.name == 'chkSelectAdd') && (elm.checked == false)) {
                elm.checked = true;
                changeColor(elm);
                flag = 1;
            }
        }
        return false;
    }

    function DeselectCheck() {
        for (i = 0; i < document.forms[0].elements.length; i++) {
            elm = document.forms[0].elements[i];

            if ((elm.type == 'checkbox') && (elm.name == 'chkSelectAdd') && (elm.checked == true)) {
                elm.checked = false;
                changeColor(elm);
            }

        }

        return false;
    }

// changes the color of the selected row

function changeColor(chkBox) {

        var rowVar = chkBox.parentNode.parentNode;
        if (chkBox.checked) {
            rowVar.style.backgroundColor = "#EDEDED";
        }
        else {
            rowVar.style.backgroundColor = "#FFFFFF";
        }
    }

其中chkAdd是标题处的复选框名称,用于添加,chkSelectAdd是GridView中添加标题下的复选框名称。

在GridView的ItemTemplate中使用像这样

<ItemTemplate>
                               <input  name="chkSelectAdd" type="checkbox" value='<%#DataBinder.Eval(Container.DataItem,"ID") %>'
                                        onclick='javascript: changeColor(this)' />
                           </ItemTemplate>