说明：开发环境 vs2012 asp.net mvc4 c#

1、效果图

2、HTML代码

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EasyuiCombotree.aspx.cs" Inherits="MvcAppTest.EasyuiCombotree" %>
  2.  
  3. <!DOCTYPE html>
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  8.     <title>Easyui Combotree 测试</title>
  9.     <link href="Easyui/themes/default/easyui.css" rel="stylesheet" />
  10.     <script src="Easyui/jquery-1.7.2.js"></script>
  11.     <script src="Easyui/jquery.easyui.min.js"></script>
  12.     <script src="Easyui/locale/easyui-lang-zh_CN.js"></script>
  13.     <script type="text/javascript">
  14.         $(function () {
  15.             $('#cc').combobox({
  16.                 url: 'Home/getOffice',
  17.                 valueField: 'id',
  18.                 textField: 'text',
  19.                 required: true,
  20.                 queryParams: { OFFID: 100 },
  21.                 editable: false,//不可编辑，只能选择
  22.                 disabled: false,
  23.                 value: '选择部门'
  24.             });
  25.         });
  26.         function getValue()
  27.         {
  28.             var value = $('#cc').combobox('getValue');
  29.             alert(value);
  30.         }
  31.         function getText()
  32.         {
  33.             var text = $('#cc').combobox('getText');
  34.             alert(text);
  35.         }
  36.     </script>
  37. </head>
  38. <body>
  39.   <input id="cc" name="dept" value=""    />
  40.   <div><input type="button" value="获取Value的值" style="width:100px;" onclick="getValue()"/>&nbsp;&nbsp;&nbsp;<input type="button" value="获取text的值" onclick="getText()" style="width:100px;" /></div>
  41. <div style="height:30px;"></div>
  42. <span>combobox 另一种定义形式</span>
  43. <div>
  44. <select id="Select1" class="easyui-combobox" name="dept" style="width:200px;">
  45.     <option value="aa">aitem1</option>
  46.     <option>bitem2</option>
  47.     <option>bitem3</option>
  48.     <option>ditem4</option>
  49.     <option>eitem5</option>
  50. </select>
  51. </div>
  52. </body>
  53. </html>
  54.  

3、Home后台代码

  1.         public JsonResult getOffice(string OFFID)
  2.         {
  3.              Int32 officeID = Convert.ToInt32(OFFID);
  4.             List<ComboModel> myList = new List<ComboModel>();          
  5.  
  6.                 for (int i = ; i < ; i++)
  7.                 {
  8.                     ComboModel model = new ComboModel()
  9.                     {
  10.                       id=i,
  11.                        text="部门"+i.ToString()
  12.                     };
  13.                     myList.Add(model);
  14.                 }
  15.  
  16.             return Json(myList, JsonRequestBehavior.DenyGet);
  17.         }
  1.    public class ComboModel
  2.     {
  3.         public System.Int32 id { get; set; }
  4.         public System.String text { get; set; }
  5.     }

Easyui combobox 怎么加载数据的更多相关文章

  1. easyui combobox 动态加载数据C#

    <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></scri ...

  2. easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题

    在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...

  3. easyui combobox 动态加载数组数据

    怕自己忘了,记录下来以后用方便 html部分 <input id="rzcode" name="businesItemId" style="wi ...

  4. combobox远程加载数据的总结和Json数据的小结

    1.从后台返回请求加载Combobox下拉框数据 html部分1 <select name="mateBelongZ" id="mateBelongZID" ...

  5. easyui combobox 动态加载的两种方法

    reload 方法 javascript代码 //指定id 和 text 否则始终选择第一个 $('#contact_city').combobox({ valueField:'id', textFi ...

  6. easyui datagrid 动态加载数据 渲染问题，表格错位问题

    $('#dg').datagrid({ url:'datagrid_data.json', columns:[[ {field:'code',title:'Code',width:100}, {fie ...

  7. jquery easyui datagrid 远程加载数据----把主键渲染为值遇到的问题及解决方案

    起因:数据库中一些字段存的是代表具体值的数字,需要渲染为具体值 monggodb中的字典 mysql中存放的值为:expertin代表教练擅长的搏击技能 jquery easyui中的相关代码如下:用 ...

  8. jquery easyui datagrid 远程加载数据----javascript法

    jquery easyui有三种办法生成datagrid(数据网格),本篇专门讨论javascript借助jquey easy ui实现的方式 html部分 <main role="m ...

  9. EasyUI 的 combotree 加载数据后折叠起来，并且只允许单击子节点的写法

    $(source).combotree({ url: '', width: kuan, valueField: 'id', textField: 'text', onlyLeafCheck: true ...

随机推荐

  1. Codeforces 899 C.Dividing the numbers-规律

      C. Dividing the numbers   time limit per test 1 second memory limit per test 256 megabytes input s ...

  2. PostMan的在线安装和简单使用

    Postman是一款很流行的WEB接口测试工具,因其强大的功能及清新的界面,赢得许多测试及开发者的喜爱.   1.PostMan的在线安装 因google退出中国,使得chrome上的扩展插件无法在线 ...

  3. CentOS 7 配置阿里云yum源

    Test at Red Hat Enterprise Linux Server release 7.5 (Maipo) File localtion /etc/yum.repos.d/epel.rep ...

  4. SpringBoot优雅的全局异常处理

    前言 本篇文章主要介绍的是SpringBoot项目进行全局异常的处理. SpringBoot全局异常准备 说明:如果想直接获取工程那么可以直接跳到底部,通过链接下载工程代码. 开发准备 环境要求 JD ...

  5. 洛谷——1968 美元汇率（DP）

    题目背景 此处省略maxint+1个数 题目描述 在以后的若干天里戴维将学习美元与德国马克的汇率.编写程序帮助戴维何时应买或卖马克或美元,使他从100美元开始,最后能获得最高可能的价值. 输入输出格式 ...

  6. 笔记-迎难而上之Java基础进阶-终

    使用Stream流的方式,遍历集合 import java.util.*; public class StreamDemo{ public static void main(String[] args ...

  7. Oracle数据库搭建

  8. PHP实现RabbitMQ的Publish/Subscribe

    <?php /** * Created by PhpStorm. * User: 豆腐居士 * Date: 2018/5/30 * Time: 上午11:01 */ class AqiTask ...

  9. shell实践--shell内嵌指令实现查看上线时间

    实践小点子: 1. 做一个shell 内嵌指令例如:ls,cd,pwd这样     就实现查看上线多久:   解决办法有两种: 1) 利用脚本,如新指令为look;利用别名的方法,将look.sh脚本 ...

  10. linux查看端口状态相关命令

    netstat netstat 命令应用是比较频繁的,比如查看端口占用啦,查看端口进程啦,这些时候都是有必要的. netstat命令各个参数说明如下: -t : 指明显示TCP端口 -u : 指明显示 ...