请孟子和其他大虾进来帮下忙，关于checkbox的问题~~~

Question

请先看下http://dotnet.aspx.cc/ShowDetail.aspx?id=F43AF9A5-2C2E-4AA6-E976-21E9569F5A8A
这个是孟大大的关于checkbox的文章，我的问题和他的需求差不多，但是需要一选择就出结果，而不是再点击按钮，我的代码完成了一部分，主要是在分页后无法保存上一页的值，而且不太清楚如何在返回上页时将以前选中的checked了，请耐心看下我的代码：JS的
function checkbox_onchange() {
 
var CatchHERa = GridView1.all.tags("INPUT");

var eleValue = document.all["eleValue"];

var eleName = document.all["eleName"];
//alert(document.all["eleValue"].value);
eleValue.value = eleName.value = "";

for (var i=0; i<CatchHERa.length; i++) {

if (CatchHERa[i].checked) {

var tdl = CatchHERa[i].parentNode;

while (tdl.tagName != "TR")

tdl = tdl.parentNode;
    alert(eleValue.value);
eleValue.value = ((eleValue.value == "") ? tdl.cells[2].innerText : eleValue.value + "," + tdl.cells[2].innerText);

eleName.value = ((eleName.value == "") ? tdl.cells[2].innerText : eleName.value + "," + tdl.cells[2].innerText);

}
}ASPX页的，我用的是VS2005  的GRIDVIEW<form id="form1" runat="server">
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="ObjectDataSource1" AllowPaging="True" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:BoundField DataField="STATIONID" HeaderText="STATIONID" SortExpression="STATIONID" />
                <asp:TemplateField>
                    <ItemTemplate>
                     
                        <asp:CheckBox ID="chkSelect" runat="server" onclick="checkbox_onchange()"/>
                    </ItemTemplate>
                
                </asp:TemplateField>
                <asp:BoundField DataField="STATIONNAME" HeaderText="STATIONNAME" SortExpression="STATIONNAME" />
                <asp:BoundField DataField="SECONDNAME" HeaderText="SECONDNAME" SortExpression="SECONDNAME" />
                <asp:BoundField DataField="THIRDNAME" HeaderText="THIRDNAME" SortExpression="THIRDNAME" />
                <asp:BoundField DataField="ALLROAD" HeaderText="ALLROAD" SortExpression="ALLROAD" />
            </Columns>
        </asp:GridView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="GetAllList"
            TypeName="BusManage.BLL.BusStation"></asp:ObjectDataSource>
            <input id="eleName" readonly
type="text" size="53" runat="server"> <input id="eleValue" type="hidden" runat="server">
    </form>请帮忙解决下~~~~~~~

Answer 1

我的GRIDVIEW绑的是ObjectDataSource数据源，方法可查到库中数据，分页为GRIDVIEW的分页，所以我的ASPX.CS页没有代码

Answer 2

1 你可以使用一个hidden的runat＝server的字段来保存已经选择过的记录id号
2 翻页的时候就可以根据这个来重新绑定下选择状态

Answer 3

jimu8130(火箭的未来在哪里?)
谢谢哈，我先试试 那如何在返回上一页是判断是否有checked的并将其选中呢？
..........O15013245O(懒得起昵称)   出差了 寒~~~~~~~~
不知道幕白兄在不

Answer 4

貌似还是有些问题，我需要选中就显示，取消选中就要消失。
而且jimu8130(火箭的未来在哪里?) 您说的hidden 的字段？还是控件在什么时候触发执行呢？

Answer 5

每次提交后循环checkbox将选中状态保存在一个可以放在viewstate的对象中显示的时候根据这样显示.   <asp:CheckBox ID="chkSelect" 
Checked='<%#GetStatus(Eval("id").ToString())%>'
runat="server" onclick="checkbox_onchange()"/>
后台GetStatus函数中比较当前id和viewstate中选中id,如果符合,则选中,否则则不选中. 注意在保存状态时.
如果当前checkbox的状态为非选中,一定要从viewstate中去除这一项.

Answer 6

cpp2017(慕白兄)  谢谢帮忙，但是目前我的代码和孟子的还是有差别的，现在主要是在跨页后无法存储上一页的值，个人感觉是不是应该在JS中做文章呢？
而且还要能够选中就有取消选中则消失  
可不可以在现在有的JS代码中做些修改呢？

Answer 7

是本页的分页  这个分页是GRIDVIEW自带实现的分页效果
比如我在第一页选择了 火车站和八一站  然后翻到第二页  在点选 结果第一页的值就丢了 
您拿我这个代码 小改一下就知道效果了

Answer 8

<script language="javascript" type="text/javascript">
       
        SetCheckBoxStatus();
        function SetCheckBoxStatus()
        {
            var tb = document.getElementById("GridView1");
            var eleValue = document.getElementById("eleValue").value;
             
            for(var i=1;i<tb.rows.length-1;i++)
            {
                var chk =   tb.rows[i].cells[1].firstChild;
                 
                if(eleValue.indexOf(tb.rows[i].cells[2].innerText) >-1)
                {
                    chk.checked = true;
                }
                
            }
        }
        function checkbox_onchange()
        
         {
 
        
        
        var tb = document.getElementById("GridView1");
            var eleValue = document.getElementById("eleValue");
             
            for(var i=1;i<tb.rows.length-1;i++)
            {
                var chk =   tb.rows[i].cells[1].firstChild;
                var id  =   tb.rows[i].cells[2].innerText; 
                eleValue.value = eleValue.value.replace(id+ ",","");
                if(chk.checked)
                {
                     eleValue.value = eleValue.value + id+ ",";
                } 
                
            }
           
       
        }    </script>

Answer 9

修改一下这个函数,少个,号
  function SetCheckBoxStatus()
        {
            var tb = document.getElementById("GridView1");
            var eleValue = document.getElementById("eleValue").value;
             
            for(var i=1;i<tb.rows.length-1;i++)
            {
                var chk =   tb.rows[i].cells[1].firstChild;
                 
                if(eleValue.indexOf(tb.rows[i].cells[2].innerText+",") >-1)
                {
                    chk.checked = true;
                }
                
            }
        }

Answer 10

慕白兄，这个运行SetCheckBoxStatus()貌似有错误啊~~~~
而且我记得document.getElementById("eleValue").value;是不是应该这样写？document.getElementById("<%=txtSearch.ClientID %>"）.value
而且在我这里 您的eleValue.value 为空的 而且
if(chk.checked)
{
eleValue.value = eleValue.value + id+ ",";
} 不执行啊~~~

Answer 11

您在JS里直接这么写SetCheckBoxStatus();没有问题么？
麻烦您了 我不太明白

Answer 12

我试过是可以的.
document.getElementById("<%=txtSearch.ClientID %>"）.value
当然更好.

Answer 13

幕白兄   您的SetCheckBoxStatus()方法一直报一个缺少对象的错误，而且 
if(chk.checked)
{
eleValue.value = eleValue.value + id+ ",";
}这个判断始终没有执行
我真晕菜了...........

Answer 14

不是那个,是运行后的html

Answer 15

<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTQ3Mzg0MzE0OA9kFgICAQ9kFgICAQ88KwANAQAPFgYeC18hRGF0YUJvdW5kZx4JUGFnZUNvdW50ArMCHgtfIUl0ZW1Db3VudAKXB2QWAmYPZBYIAgEPZBYKZg8PFgIeBFRleHQFATFkZAICDw8WAh8DBQ/lhazkuqTkuInlhazlj7hkZAIDDw8WAh8DBQzljJflm73otoXluIJkZAIEDw8WAh8DBRvnn7PlrrbluoTogYzkuJrmioDmnK/lrabpmaJkZAIFDw8WAh8DBQYmbmJzcDtkZAICD2QWCmYPDxYCHwMFATJkZAICDw8WAh8DBQnliqjnianlm61kZAIDDw8WAh8DBQYmbmJzcDtkZAIEDw8WAh8DBQYmbmJzcDtkZAIFDw8WAh8DBQYmbmJzcDtkZAIDD2QWCmYPDxYCHwMFATNkZAICDw8WAh8DBQzlj4LosIvlrabpmaJkZAIDDw8WAh8DBQYmbmJzcDtkZAIEDw8WAh8DBQYmbmJzcDtkZAIFDw8WAh8DBQYmbmJzcDtkZAIEDw8WAh4HVmlzaWJsZWhkZBgCBR5fX0NvbnRyb2xzUmVxdWlyZVBvc3RCYWNrS2V5X18WAwUZR3JpZFZpZXcxJGN0bDAyJGNoa1NlbGVjdAUZR3JpZFZpZXcxJGN0bDAzJGNoa1NlbGVjdAUZR3JpZFZpZXcxJGN0bDA0JGNoa1NlbGVjdAUJR3JpZFZpZXcxD2dkb5u9aJlCTZ2FKNacKQpWpijY+u4=" />
</div><script type="text/javascript">
<!--
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
// -->
</script>
        <div>
<table cellspacing="0" rules="all" border="1" id="GridView1" style="border-collapse:collapse;">
<tr>
<th scope="col">STATIONID</th><th scope="col">&nbsp;</th><th scope="col">STATIONNAME</th><th scope="col">SECONDNAME</th><th scope="col">THIRDNAME</th><th scope="col">ALLROAD</th>
</tr><tr>
<td>1</td><td>
                        &nbsp;
                        <input id="GridView1_ctl02_chkSelect" type="checkbox" name="GridView1$ctl02$chkSelect" onclick="checkbox_onchange();" />
                    </td><td>公交三公司</td><td>北国超市</td><td>石家庄职业技术学院</td><td>&nbsp;</td>
</tr><tr>
<td>2</td><td>
                        &nbsp;
                        <input id="GridView1_ctl03_chkSelect" type="checkbox" name="GridView1$ctl03$chkSelect" onclick="checkbox_onchange();" />
                    </td><td>动物园</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</tr><tr>
<td>3</td><td>
                        &nbsp;
                        <input id="GridView1_ctl04_chkSelect" type="checkbox" name="GridView1$ctl04$chkSelect" onclick="checkbox_onchange();" />
                    </td><td>参谋学院</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</tr><tr>
<td colspan="6"><table border="0">
<tr>
<td><span>1</span></td><td><a href="javascript:__doPostBack('GridView1','Page$2')">2</a></td><td><a href="javascript:__doPostBack('GridView1','Page$3')">3</a></td><td><a href="javascript:__doPostBack('GridView1','Page$4')">4</a></td><td><a href="javascript:__doPostBack('GridView1','Page$5')">5</a></td><td><a href="javascript:__doPostBack('GridView1','Page$6')">6</a></td><td><a href="javascript:__doPostBack('GridView1','Page$7')">7</a></td><td><a href="javascript:__doPostBack('GridView1','Page$8')">8</a></td><td><a href="javascript:__doPostBack('GridView1','Page$9')">9</a></td><td><a href="javascript:__doPostBack('GridView1','Page$10')">10</a></td><td><a href="javascript:__doPostBack('GridView1','Page$11')">...</a></td>
</tr>
</table></td>
</tr>
</table>
</div>
        
            <input name="eleName" type="text" id="eleName" readonly="" size="53" /> <input name="eleValue" type="hidden" id="eleValue" />
        <span id="Label1"></span>
    
<div> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWEALL2O2bCwKqjvG1AgLByIHxCAL0sOubBgKtsp64BAKtsuK4BAKtsva4BAKtsvq4BAKtsu64BAKtsvK4BAKtssa4BAKtssq4BALDuK6IBQKokYx1AorX2+sCArrquO0DGNmg0dgwpvyVdL2li/AjczUuhu8=" />
</div></form>

Answer 16

你的checkbox前有空格.
去掉就可,另应该把id保存到hiiden中不要用名称.即
     var id  =   tb.rows[i].cells[0].innerText;

Answer 17

............不愧是慕白兄，出来了，就因为checkbox前面有个空格，晕了~~~~~~
您的这个SetCheckBoxStatus()方法是来返回上页将以前选中的在勾上吧？
但是总是报脚本错误啊，说缺少对象，您的checkbox_onchange方法太帅了，错误是我这里出的

Answer 18

尽快学会 debug javascript

Answer 19

哥们可以使用Cookie来保存上一页的Check状态

Answer 20

TO: wenxueqian()
我这个是本页的分页，并未提交到下一页，也许是我前面没说清楚，我还在研究 慕白兄 给出的代码

Answer 21

恩，慕白兄 我找到为什么报错了，你的SetCheckBoxStatus()方法本身没有错误，但是放的位置貌似不太好，因为当页刷出来时首先执行SetCheckBoxStatus()方法，这时CHECKBOX并没有加载，所以
var chk = tb.rows[i].cells[1].firstChild;这句就会报出找不到对象，我将SetCheckBoxStatus()方法放到了页面的最后，就OK了，十分感谢 慕白兄，我等等在结帖哈，看看还有别的问题要麻烦您么，呵呵，有点贪婪了