需求描述：专业分流系统中，学生在选择志愿时，我想实现在页面按照点击相应专业的顺序来设置选专业的志愿，如首先点击“工商”，则工商专业为第一志愿，接着点击“营销”，则营销专业为第二志愿，以此类推。从而达到所选志愿不会重复的效果。以下是我的实现方法。
html控件用js赋值之后可以在页面中显示，但后台无法获取改变之后的值。因此我用了一个比较笨的办法，就是加一个隐藏的服务器控件，后台用Request.Form方法取这个隐藏控件的值。大佬们有更好的方法欢迎赐教。
JS
<script type="text/javascript"> $(".chooseitem").click(function () { var thisText = $(this).text(); var aLength = $(".selected").length; var thisDataId = $(this).attr("data-id"); if ($(this).hasClass("whitesmoke")) { return false; } $(this).addClass("whitesmoke"); $(".tdlable").eq(aLength).html("<label class='ddl selected' data-id='" + thisDataId + "' id='Label" + thisDataId + "'>" + thisText + "</label>"); $(".hiddenddl").eq(aLength).val(thisDataId); });; function cancel() { $(".chooseitem").removeClass("whitesmoke"); $(".ddl").empty(); } </script>
前台代码
<div class="choose"> <div class="chooseitem" data-id="1">人力</div> <div class="chooseitem" data-id="2">信管</div> <div class="chooseitem" data-id="3">工商</div> <div class="chooseitem" data-id="4">营销</div> <div class="chooseitem" data-id="5">公管</div> <div class="chooseitem" data-id="6">财务ACCA</div> <div class="chooseitem" data-id="7">会计</div> </div> <div id="wish"> <table> <tr> <td class="td1">第一志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第二志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第三志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第四志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第五志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第六志愿：</td> <td class="tdlable"></td> </tr> <tr> <td class="td1">第七志愿：</td> <td class="tdlable"></td> </tr> <tr style="height:50px"> <td colspan="2" style="text-align:center;"> <asp:Button ID="btnSave" runat="server" Text="保存" OnClick="btnSaveClick"/> <asp:Button ID="btnCancel" runat="server" Text="重新选择" OnClientClick="cancel();"/> </td> </tr> </table> </div> </div> </div> <table class="hiddenTb"> //这里设置display=none <tr> <td class="td1">第一志愿：</td> <td><asp:DropDownList ID="ddlOne" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第二志愿：</td> <td><asp:DropDownList ID="ddlTwo" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第三志愿：</td> <td><asp:DropDownList ID="ddlThree" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第四志愿：</td> <td><asp:DropDownList ID="ddlFour" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第五志愿：</td> <td><asp:DropDownList ID="ddlFive" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第六志愿：</td> <td><asp:DropDownList ID="ddlSix" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> <tr> <td class="td1">第七志愿：</td> <td><asp:DropDownList ID="ddlSeven" runat="server" CssClass="hiddenddl" ></asp:DropDownList></td> </tr> </table> </div>
后台代码
protected void LoadData() { int StuID = Convert.ToInt32(Session["UserNo"].ToString()); DepartmentMIS.Model.StuInfo StuModel = StuBLL.GetModel(StuID); //给隐藏控件绑定值，方便后续取值 ddlOne.DataSource = DepBLL.GetList("isDeleted = 0"); ddlOne.DataTextField = "department"; ddlOne.DataValueField = "id"; ddlOne.DataBind(); if (StuModel.department1.ToString() != "") { ddlOne.SelectedValue = StuModel.department1.ToString(); } else { ddlOne.SelectedValue = "1"; } ddlTwo.DataSource = DepBLL.GetList("isDeleted = 0"); ddlTwo.DataTextField = "department"; ddlTwo.DataValueField = "id"; ddlTwo.DataBind(); if (StuModel.department2.ToString() != "") { ddlTwo.SelectedValue = StuModel.department2.ToString(); } else { ddlTwo.SelectedValue = "2"; } ddlThree.DataSource = DepBLL.GetList("isDeleted = 0"); ddlThree.DataTextField = "department"; ddlThree.DataValueField = "id"; ddlThree.DataBind(); if (StuModel.department3.ToString() != "") { ddlThree.SelectedValue = StuModel.department3.ToString(); } else { ddlThree.SelectedValue = "3"; } ddlFour.DataSource = DepBLL.GetList("isDeleted = 0"); ddlFour.DataTextField = "department"; ddlFour.DataValueField = "id"; ddlFour.DataBind(); if (StuModel.department4.ToString() != "") { ddlFour.SelectedValue = StuModel.department4.ToString(); } else { ddlFour.SelectedValue = "4"; } ddlFive.DataSource = DepBLL.GetList("isDeleted = 0"); ddlFive.DataTextField = "department"; ddlFive.DataValueField = "id"; ddlFive.DataBind(); if (StuModel.department5.ToString() != "") { ddlFive.SelectedValue = StuModel.department5.ToString(); } else { ddlFive.SelectedValue = "5"; } ddlSix.DataSource = DepBLL.GetList("isDeleted = 0"); ddlSix.DataTextField = "department"; ddlSix.DataValueField = "id"; ddlSix.DataBind(); if (StuModel.department6.ToString() != "") { ddlSix.SelectedValue = StuModel.department6.ToString(); } else { ddlSix.SelectedValue = "6"; } ddlSeven.DataSource = DepBLL.GetList("isDeleted = 0"); ddlSeven.DataTextField = "department"; ddlSeven.DataValueField = "id"; ddlSeven.DataBind(); if (StuModel.department7.ToString() != "") { ddlSeven.SelectedValue = StuModel.department7.ToString(); } else { ddlSeven.SelectedValue = "7"; } } protected void btnSaveClick(object sender, EventArgs e) { int StuID = Convert.ToInt32(Session["UserNo"].ToString()); DepartmentMIS.Model.StuInfo StuModel = StuBLL.GetModel(StuID);
StuModel.department1 = Convert.ToInt32(Request.Form[ddlOne.ClientID]); StuModel.department2 = Convert.ToInt32(Request.Form[ddlTwo.ClientID]); StuModel.department3 = Convert.ToInt32(Request.Form[ddlThree.ClientID]); StuModel.department4 = Convert.ToInt32(Request.Form[ddlFour.ClientID]); ; StuModel.department5 = Convert.ToInt32(Request.Form[ddlFive.ClientID]); StuModel.department6 = Convert.ToInt32(Request.Form[ddlSix.ClientID]); StuModel.department7 = Convert.ToInt32(Request.Form[ddlSeven.ClientID]); StuModel.updateTime = DateTime.Now; StuBLL.Update(StuModel); Response.Redirect("stuWishChoices.aspx"); }