基于MVC4+EasyUI的Web开发框架经验总结（6）–在页面中应用下拉列表的处理

<select class="easyui-combobox" id="Sex" name="Sex" style="width:120px;">
       <option>男</option>
       <option>女</option>  
 </select>

$("#Sex").combobox('setValue', info.Sex);

var postData = $("#ffAdd").serializeArray();

                    <tr>
                        <th>
                            <label for="Subscribe">是否订阅该公众号：</label>
                        </th>
                        <td colspan="3">
                            <select  id="Subscribe" name="Subscribe" class="easyui-combobox" style="width:150px">
                                <option value="1">订阅</option>
                                <option value="0">取消</option>
                            </select>&nbsp;&nbsp;&nbsp;
                        </td>
                    </tr>

$("#Subscribe1").combobox('setValue', info.Subscribe);

$("#Subscribe2").text(info.Subscribe == "1" ? "订阅": "取消");

        /// <summary>
        /// 根据字典类型获取对应的字典数据，方便UI控件的绑定
        /// </summary>
        /// <param name="dictTypeName">字典类型名称</param>
        /// <returns></returns>
        public ActionResult GetDictJson(string dictTypeName)
        {
            List<CListItem> treeList = new List<CListItem>();
            CListItem pNode = new CListItem("", "");
            treeList.Insert(0, pNode);

            Dictionary<string, string> dict = BLLFactory<DictData>.Instance.GetDictByDictType(dictTypeName);
            foreach (string key in dict.Keys)
            {
                treeList.Add(new CListItem(key, dict[key]));
            }
            return ToJsonContent(treeList);
        }

[
    {
      Text: "",
      Value: ""
    },
    {
      Text: "教授",
      Value: "教授"
    },
    {
      Text: "护士长",
      Value: "护士长"
    }
]

        function BindDictItem(control, dictTypeName) {
            $('#' + control).combobox({
                url: '/DictData/GetDictJson?dictTypeName='+ dictTypeName,
                valueField: 'Value',
                textField: 'Text'
            });
        }

        //初始化字典信息
        function InitDictItem() {
            BindDictItem("Titles", "职称");
            BindDictItem("Rank", "职务");
            BindDictItem("Importance", "重要级别");
            BindDictItem("Recognition", "对公司认可程度");
            BindDictItem("InterestDemand", "客户利益诉求");
            BindDictItem("CareFocus", "客户关心重点");
            BindDictItem("ResponseDemand", "负责需求");
            BindDictItem("RelationShip", "与公司关系");
            BindDictItem("Nationality", "民族");
            BindDictItem("Political", "政治面貌");
            BindDictItem("JobType", "职业类型");
            BindDictItem("Eduction", "学历");
            BindDictItem("Animal", "属相");
            BindDictItem("Constellation", "星座");
            BindDictItem("MarriageStatus", "婚姻状况");
            BindDictItem("HealthCondition", "健康状况");
            BindDictItem("BodyType", "体型");
        }

  <tr> 
          <th>
             <label for="Customer_ID">客户名称：</label>
           </th>
           <td colspan="3">
              <input class="easyui-validatebox" style="width:300px;background-color:peachpuff" readonly="readonly" type="text" id="Customer_Name" name="Customer_Name" data-options="required:true,validType:'length[1,50]'"/>
               <input type="hidden" style="width:300px" id="Customer_ID" name="Customer_ID" />
               <a href="javascript:void(0)" class="easyui-linkbutton" id="btnSelectCustomer" iconcls="icon-search">选择客户</a>
            </td>
     </tr>

        //绑定选择客户按钮的事件
        function BindSelectCustomerEvent() {
            $("#btnSelectCustomer").click(function () {
                $.showWindow({
                    title: '选择客户',
                    useiframe: true,
                    width: 900,
                    height: 700,
                    content: 'url:/Customer/SelectCustomer',
                    data: { id: $('#Customer_ID'), name: $('#Customer_Name') },
                    buttons: [{
                        text: '确认',
                        iconCls: 'icon-ok',
                        handler: 'doOK' //此方法在弹出页面中
                    }, {
                        text: '取消',
                        iconCls: 'icon-cancel',
                        handler: function (win) {
                            win.close();
                        }
                    }],
                    onLoad: function (win, content) {
                        //window打开时调用，初始化form内容
                        if (content) {
                            content.doInit(win);
                        }
                    }
                });
            });
        }

                $.getJSON("/Customer/GetCustomerName?id=" + info.Customer_ID, function (result) {
                    $("#Customer_Name").val(result);
                });