前后端协调处理checkbox

时间：2023-03-09 03:21:43
前后端协调处理checkbox

需求：页面属于一个弹出窗体，查询结果，用checkbox展示，选择后，把选中的结果传递给调用页面。

由于要取得后端写的checkbox控件的值，所以在后端处理最后的提交事件，用这个语句把结果传递到页面中的js代码，实现对上级页面的调用：

ClientScript.RegisterStartupScript(typeof(string), "LoadCID", "parent.finishcatalog('"+TextBox2.Text+"')", true);

不过发现IE8正常，360，ff，chrome都不行，只能重来。

方案1：后端提交时，把结果用绑定串的方式传到前端，失败。因为前端的代码比后端要先执行

方案2：用jquery读取checkbox，但发现aspx生成的input代码，很难访问，没有value

<input id="CheckBoxList1_0" type="checkbox" name="CheckBoxList1$0" /><label for="CheckBoxList1_0">A052118:汽车工业</label><br />

方案3：在后端不用控件，构造html代码，前端处理

后端：

        for(int i=0;i<dt.Rows.Count;i++)   //构造html代码，便于客户端访问

        {

            strCheckList += "<input type='checkbox' id='chk" + i.ToString() + "' value='" + dt.Rows[i]["f_Code"].ToString() + "' />";

            strCheckList += "<label >" + dt.Rows[i]["f_Code"].ToString() + ":" + dt.Rows[i]["f_Name"].ToString() + "</label><br />";

        }

前端：

       function seled()

       {

            var vals = "";

            $('input:checkbox:checked').each(function (index, item) {

              vals+=(vals==""?"":"|")+$(this).val()

            });

            parent.finishcatalog(vals);   //在后台调用

            parent.wbox.close();

       }

效果：

前后端协调处理checkbox