如：求职中有 人力资源类，IT 类等，IT 类又有 .NET 开发，Java开发，运维等
实现：下拉框展示总体类别，复选框展示选中类别中的详细
主要方式：选中下拉框内容时出发复选框控件，将属于某一类的全部查出
一、页面数据展示
1、展示页面主要引用下拉框空间和复选框控件，包括图片控件用于全选，反选以及置空操作
<tr><td align="right">求职内容：</td><td align="left"> <table cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td><asp:DropDownList ID="ddlJobUser_job_JobContent_Name1_4132" AutoPostBack="True" OnSelectedIndexChanged="ddlJobUser_job_JobContent_Name_4132Select" runat="server"></asp:DropDownList></td> <td align="right">
<asp:ImageButton ID="btnsel1" runat="server" ImageUrl="~/qdAdmin/qdimages/xsel.png" Width="12" Height="12" onclick="btnsel1_Click" title="全选" />
<asp:ImageButton ID="btnnx1" runat="server" ImageUrl="~/qdAdmin/qdimages/xselx.png" Width="12" Height="12" onclick="btnnx1_Click" title="反选" />
<asp:ImageButton ID="btnselnot1" runat="server" ImageUrl="~/qdAdmin/qdimages/xselnot.png" Width="12" Height="12" onclick="btnselnot1_Click" title="全空" /></td> </tr> <tr><td colspan="2" align="left"><asp:CheckBoxList ID="cblJobUser_job_JobContent_Name1_4132" RepeatColumns="2" runat="server" style="word-break: keep-all;white-space:nowrap;"></asp:CheckBoxList></td></tr> </table> </td> </tr>
2、可以后台控制下拉框长度等样式，尽量能封装的就封装，增强代码的可复用性，方便下次使用
//调用基本页面中的 SetDropDownListStyleLineBlack 方法用于控制下拉框长度 base.SetDropDownListStyleLineBlack(ddlJobUser_job_JobContent_Name1_4132, 100); //主要实现 public void SetDropDownListStyleLineBlack(DropDownList ddl, int iWidth) { string slabel = string.Empty; StringBuilder sb = new StringBuilder(); sb.Append("border-bottom- 1px;"); sb.Append("border-bottom-style: solid;"); sb.Append("border-bottom-color: #D4D0C8;"); sb.Append("text-align: center;"); //sb.Append("font-size: 12px;"); //sb.Append("font-weight: bold;"); //sb.Append("color: #FF0000;"); sb.Append("border-top- 0px;"); sb.Append("border-right- 0px;"); sb.Append("border-left- 0px;"); sb.Append("border-top-style: none;"); sb.Append("border-right-style: none;"); sb.Append("border-left-style: none;"); if (iWidth > 0) sb.Append("" + iWidth + "px;"); ddl.Attributes.Add("style", sb.ToString()); }
3、属性解释以及后台方法：
3.1、下拉框
ID="ddlJobUser_job_JobContent_Name1_4132" 用于给下拉框赋值
在数据库设计的时候要注意这种右级别关系的数据一般使用 code 分级,考虑的多点使用9位为一组，如 000000001 为一级，000000001000000001为二级，其中000000001 是 000000001000000001 的父级，000000001000000001是000000001的第一个儿子。
设计时也可以加了 lever 进行标识第几级，这样查找时更方便点，空间和时间自己把握
//获取数据库中的值 List<ITEM.Model.qdCnt4.FourCollsType> mList11 = _bllTypeColls.Get_Ex_FourCollsTypeListByIDLevel("TypeCollGuid,TypeCollName,TypeCollCode", base.EnterpriseGuid, 4132, 1, 0f); { //赋值 this.ddlJobUser_job_JobContent_Name1_4132.DataTextField = "TypeCollName"; this.ddlJobUser_job_JobContent_Name1_4132.DataValueField = "TypeCollCode"; this.ddlJobUser_job_JobContent_Name1_4132.DataSource = mList11; this.ddlJobUser_job_JobContent_Name1_4132.DataBind(); //默认选中的为空 this.ddlJobUser_job_JobContent_Name1_4132.Items.Insert(0, new ListItem()); //执行选择的事件 ddlJobUser_job_JobContent_Name_4132Select(new object(), new EventArgs()); }
AutoPostBack="True" 和 OnSelectedIndexChanged="ddlJobUser_job_JobContent_Name_4132Select" 用于点击下拉框时同时触发后台中的ddlJobUser_job_JobContent_Name_4132Select 方法
3.2、复选框
ID="cblJobUser_job_JobContent_Name1_4132" 用于给复选框赋值
RepeatColumns="2" 控制复选框展示的内容， 一行展示两个
protected void ddlJobUser_job_JobContent_Name_4132Select(object sender, EventArgs e) { //获取下拉框中选中的值 string Scode = this.ddlJobUser_job_JobContent_Name1_4132.SelectedValue; if (Scode != "") { //根据选中的值查表 List<ITEM.Model.qdCnt4.FourCollsType> mList = _bllTypeColls.Get_Ex_FourCollsTypeList_CodeDown("TypeCollCode,TypeCollName", base.EnterpriseGuid, 4132, Scode, 0f); //给复选框赋值 this.cblJobUser_job_JobContent_Name1_4132.DataTextField = "TypeCollName"; this.cblJobUser_job_JobContent_Name1_4132.DataValueField = "TypeCollCode"; this.cblJobUser_job_JobContent_Name1_4132.DataSource = mList; this.cblJobUser_job_JobContent_Name1_4132.DataBind(); } else { this.cblJobUser_job_JobContent_Name1_4132.Items.Clear(); } }
3.3、图片事件，控制复选框是否选中
ID="btnsel1" // 用于标识该图片事件 ImageUrl="~/qdAdmin/qdimages/xsel.png" // 用于给该图片事件选个图片 Width="12" Height="12" // 用于指定大小 onclick="btnsel1_Click" // 用于点击图片调用 btnsel1_Click方法 title="全选" //由于鼠标放在图片上给个提示
控制全选
protected void btnsel1_Click(object sender, ImageClickEventArgs e) { ImageButton btn = (ImageButton)sender; if (btn.ID == "btnsel1") { for (int i = 0; i <= this.cblJobUser_job_JobContent_Name1_4132.Items.Count - 1; i++) { //将复选框代表的值全都选中 this.cblJobUser_job_JobContent_Name1_4132.Items[i].Selected = true; } } }
控制置空
protected void btnselnot1_Click(object sender, ImageClickEventArgs e) { ImageButton btn = (ImageButton)sender; if (btn.ID == "btnselnot1") { for (int i = 0; i <= this.cblJobUser_job_JobContent_Name1_4132.Items.Count - 1; i++) { //将复选框代表的值全都置空 this.cblJobUser_job_JobContent_Name1_4132.Items[i].Selected = false; } } }
控制反选
protected void btnnx1_Click(object sender, ImageClickEventArgs e) { ImageButton btn = (ImageButton)sender; if (btn.ID == "btnnx1") { for (int i = 0; i <= this.cblJobUser_job_JobContent_Name1_4132.Items.Count - 1; i++) { //将复选框代表的值，选中的变成未选中 this.cblJobUser_job_JobContent_Name1_4132.Items[i].Selected = !this.cblJobUser_job_JobContent_Name1_4132.Items[i].Selected; } } }
二、存储与展示
1、在数据库中使用 code 和 name 进行存储，可以存取多组如下，因此写入数据库和展示时要注意将不同类别之间分开
code 表示层级，如下：000000039 表示下拉框中的 IT，000000039000000003就表示具体的职业Java开发工程师，使用 | 分隔为两组
000000039000000003,000000039000000010|,000000032000000001,000000032000000004
设计时要注意其长度，我这边就省事点了，
2、多组存储
#region 求职内容 { _job_userinfo.JobUser_job_JobContent_4132_Code = "";// mUserInfo.JobUser_job_JobContent_Code_4132 + strGuid;//求职内容，多选，以逗号分隔 _job_userinfo.JobUser_job_JobContent_4132_Name = "";// mUserInfo.JobUser_job_JobContent_Name_4132 + strText;//求职内容，多选，以逗号分隔 if (this.cblJobUser_job_JobContent_Name_4132.SelectedValue != "") { string strGuid = ""; string strText = ""; foreach (ListItem item in cblJobUser_job_JobContent_Name_4132.Items) { if (item.Selected == true) { string sign = strGuid == string.Empty ? "" : ","; strGuid += sign + item.Value; strText += sign + item.Text; } } _job_userinfo.JobUser_job_JobContent_4132_Code = strGuid;//求职内容，多选，以逗号分隔 _job_userinfo.JobUser_job_JobContent_4132_Name = strText;//求职内容，多选，以逗号分隔 } if (this.cblJobUser_job_JobContent_Name2_4132.SelectedValue != "") { string strGuid = ""; string strText = ""; foreach (ListItem item in cblJobUser_job_JobContent_Name2_4132.Items) { if (item.Selected == true) { string sign = strGuid == string.Empty ? "" : ","; strGuid += sign + item.Value; strText += sign + item.Text; } } strGuid = _job_userinfo.JobUser_job_JobContent_4132_Code == string.Empty ? strGuid : "|," + strGuid; strText = _job_userinfo.JobUser_job_JobContent_4132_Code == string.Empty ? strText : "," + strText; _job_userinfo.JobUser_job_JobContent_4132_Code = _job_userinfo.JobUser_job_JobContent_4132_Code + strGuid;//求职内容，多选，以逗号分隔 _job_userinfo.JobUser_job_JobContent_4132_Name = _job_userinfo.JobUser_job_JobContent_4132_Name + strText;//求职内容，多选，以逗号分隔 } if (this.cblJobUser_job_JobContent_Name3_4132.SelectedValue != "") { string strGuid = ""; string strText = ""; foreach (ListItem item in cblJobUser_job_JobContent_Name3_4132.Items) { if (item.Selected == true) { string sign = strGuid == string.Empty ? "" : ","; strGuid += sign + item.Value; strText += sign + item.Text; } } strGuid = _job_userinfo.JobUser_job_JobContent_4132_Code == string.Empty ? strGuid : "|," + strGuid; strText = _job_userinfo.JobUser_job_JobContent_4132_Code == string.Empty ? strText : "," + strText; _job_userinfo.JobUser_job_JobContent_4132_Code = _job_userinfo.JobUser_job_JobContent_4132_Code + strGuid;//求职内容，多选，以逗号分隔 _job_userinfo.JobUser_job_JobContent_4132_Name = _job_userinfo.JobUser_job_JobContent_4132_Name + strText;//求职内容，多选，以逗号分隔 } } #endregion
3、显示
#region 求职内容 if (job_userinfo.JobUser_job_JobContent_4132_Code.Length > 0) { #region 对原始数据处理 string strGuid = job_userinfo.JobUser_job_JobContent_4132_Code;// ,1,2,3,|,1,2,3|,1,2,3,5,| strGuid = "^" + strGuid; strGuid = strGuid.Replace("^,", "").Replace("^", "").Replace(",|", "|").Replace("|,", "|"); strGuid = strGuid + "%"; strGuid = strGuid.Replace("|%", "").Replace("%", ""); string strName = job_userinfo.JobUser_job_JobContent_4132_Name; strName = ("^" + strName).Replace("^,", "").Replace("^", ""); #endregion //this.LabJobUser_job_JobContent_Name_4132Select.Text = strName; strs = strGuid.Split('|'); if (strs.Length > 0) { string[] strs1 = strs[0].Split(','); if (strs1[0].Length >= 9) { List<ITEM.Model.qdCnt4.FourCollsType> modelList = _bllTypeColls.Get_Ex_FourCollsTypeListByIDLevel("*", base.EnterpriseGuid, 4132, 1, " and typecollcode = '" + strs1[0].Substring(0, 9) + "'", 0f); this.ddlJobUser_job_JobContent_Name_4132.SelectedValue = strs1[0].Substring(0, 9).ToLower(); ddlJobUser_job_JobContent_Name_4132Select(new object(), new EventArgs()); for (int i = 0; i < strs1.Length; i++) { foreach (ListItem it in this.cblJobUser_job_JobContent_Name_4132.Items) { if (it.Value == strs1[i] && strs1[i] != "") { it.Selected = true; } } } } } if (strs.Length > 1) { string[] strs1 = strs[1].Split(','); if (strs1[0].Length >= 9) { List<ITEM.Model.qdCnt4.FourCollsType> modelList = _bllTypeColls.Get_Ex_FourCollsTypeListByIDLevel("*", base.EnterpriseGuid, 4132, 1, " and typecollcode = '" + strs1[0].Substring(0, 9) + "'", 0f); this.ddlJobUser_job_JobContent_Name2_4132.SelectedValue = strs1[0].Substring(0, 9).ToLower(); ddlJobUser_job_JobContent_Name2_4132Select(new object(), new EventArgs()); for (int i = 0; i < strs1.Length; i++) { foreach (ListItem it in this.cblJobUser_job_JobContent_Name2_4132.Items) { if (it.Value == strs1[i] && strs1[i] != "") { it.Selected = true; } } } } } if (strs.Length > 2) { string[] strs1 = strs[2].Split(','); if (strs1[0].Length >= 9) { List<ITEM.Model.qdCnt4.FourCollsType> modelList = _bllTypeColls.Get_Ex_FourCollsTypeListByIDLevel("*", base.EnterpriseGuid, 4132, 1, " and typecollcode = '" + strs1[0].Substring(0, 9) + "'", 0f); this.ddlJobUser_job_JobContent_Name3_4132.SelectedValue = strs1[0].Substring(0, 9).ToLower(); ddlJobUser_job_JobContent_Name3_4132Select(new object(), new EventArgs()); for (int i = 0; i < strs1.Length; i++) { foreach (ListItem it in this.cblJobUser_job_JobContent_Name3_4132.Items) { if (it.Value == strs1[i] && strs1[i] != "") { it.Selected = true; } } } } } } #endregion