JQueryEasyUI框架下的combobox的取值和绑定的方法


Posted in Javascript onJanuary 22, 2017

最近做的项目涉及到JQueryEasyUI框架的使用,EasyUI是什么?网上解释说它是来自W3C标准WEB前端专家DHTML精英俱乐部的简单易用功能强大的轻量级WEB前端JavaScript框架!从这句话的理解来说,我认为它是一种JavaScript框架。

对于最近的使用中,给我的感觉就是,借用官网JqueryEasyUI上的一句话,EasyUI是基于jQuery用户界面插件的集合,我把它理解成一种插件,不知道有没有问题。而使用easyui,不需要写很多的javascript代码,只需在定义的用户界面写一些HTML标记,完成HTML5网页的框架,所以说在这个框架里面是没有服务器控件。没有ruant=“server”。其功能强大,使用方便。

下面就说说EasyUI框架下的combobox,在使用的时候获取值和绑定值得方法。

在前台,我们通常这么写:

<select class="easyui-combobox" id ="cmbName" name="name" ></select>

在牛腩新闻发布系统中和北大青鸟中都讲到了控件中数据绑定的问题,那在这里能不能也采用那种方法?牛腩新闻发布系统和北大青鸟中讲的控件都是服务器控件,但这里不是服务器控件,我们又该怎么绑定值和获取值?

绑定值:(方法不止这一个)

可以将这个控件转为服务器控件。加入runat=“server”,将其装为服务器控件。剩下就同牛腩新闻发布系统和北大青鸟里面讲的服务器控件一样,绑定值。

<select class="easyui-combobox" id ="cmbName"  runat="server" datatextfield ="AdminName" datavaluefield ="AdminID" name="name" style="width: 150px;" ></select>

后台:

protected void Page_Load(object sender, EventArgs e) 
    { 
        noticeInfoBLL Bnotice = new noticeInfoBLL(); 
        DataSet ds = new DataSet(); 
        ds = Bnotice.GetAllList(); 
        DataTable dt = ds.Tables[0]; 
        cmbName.DataSource =dt; 
        cmbName.DataTextField = "AdminName"; 
        cmbName.DataValueField = "AdminID"; 
        cmbName.DataBind(); 
    }

绑定值之后,怎么获取里面的值呢?

获取值:

var adminname=$("#state").combobox("getText");
 //这是获取combobox中选择的内容,例如上面绑定的“AdminName” 
var adminid=$("#state").combobox("getValue"); 
//这是获取combobox选择的值,例如上面绑定的“AdminID”

comboboxc绑定值出现重复:

在combobox绑定值的时候,我还遇到这么一个问题,在返回的数据中,有很多条,因为我是往combobox中绑定的名字,名字不能重复,但是我从数据库中返回的数据却是这样的:

JQueryEasyUI框架下的combobox的取值和绑定的方法

那么怎么解决这个问题呢?

有两个解决方法:

第一:修改查询语句,使用SQL SELECT DISTINCT 语句

第二:在后台绑定数据时也可以像这样绑定:

protected void Page_Load(object sender, EventArgs e) 
    { 
      //if (!Page.IsPostBack) 
      //if (Session["userid"] != null && Session["postid"] != null) 
       
        noticeInfoBLL Bnotice = new noticeInfoBLL(); 
        DataSet ds = new DataSet(); 
        ds = Bnotice.GetAllList(); 
        DataTable dt = ds.Tables[0]; 
       //去重复的AdminName和AdminID 
        DataView dv=dt.DefaultView ; 
        cmbName.DataSource = dv.ToTable(true, "AdminName","AdminId"); 
        cmbName.DataTextField = "AdminName"; 
        cmbName.DataValueField = "AdminID"; 
        cmbName.DataBind(); 
    }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
提高 DHTML 页面性能
Dec 25 Javascript
FireFox下XML对象转化成字符串的解决方法
Dec 09 Javascript
Javascript数组的排序 sort()方法和reverse()方法
Jun 04 Javascript
javascript不同类型数据之间的运算的转换方法
Feb 13 Javascript
JS 实现列表与多选框选择附预览动画
Oct 29 Javascript
js自定义回调函数
Dec 13 Javascript
AngularJS控制器详解及示例代码
Aug 16 Javascript
浅析如何利用angular结合translate为项目实现国际化
Dec 08 Javascript
Bootstrap popover用法详解
Dec 22 Javascript
12306 刷票脚本及稳固刷票脚本(防挂)
Jan 04 Javascript
ES6新特性之解构、参数、模块和记号用法示例
Apr 01 Javascript
JS中FormData类实现文件上传
Mar 27 Javascript
jQuery学习之DOM节点的插入方法总结
Jan 22 #Javascript
select下拉框插件jquery.editable-select详解
Jan 22 #Javascript
原生js实现对Ajax的封装(仿jquery)
Jan 22 #Javascript
js遍历json的key和value的实例
Jan 22 #Javascript
jquery pagination分页插件使用详解(后台struts2)
Jan 22 #Javascript
jQuery中DOM节点的删除方法总结(超全面)
Jan 22 #Javascript
js实现贪吃蛇小游戏(容易理解)
Jan 22 #Javascript
You might like
php+js iframe实现上传头像界面无跳转
2014/04/29 PHP
Yii2 GridView实现列表页直接修改数据的方法
2016/05/16 PHP
eclipse php wamp配置教程
2016/06/30 PHP
PHP异步进程助手async-helper
2018/02/05 PHP
基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)
2010/09/28 Javascript
js不完美解决click和dblclick事件冲突问题
2012/07/16 Javascript
jQuery学习笔记 更改jQuery对象
2012/09/19 Javascript
JS的replace方法详细介绍
2012/11/09 Javascript
Jquery chosen动态设置值实例介绍
2013/08/08 Javascript
jQuery基础语法实例入门
2014/12/23 Javascript
js自定义回调函数
2015/12/13 Javascript
说说AngularJS中的$parse和$eval的用法
2017/09/14 Javascript
Bootstrap实现省市区三级联动(亲测可用)
2019/07/26 Javascript
JS回调函数深入理解
2019/10/16 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
vue组件中节流函数的失效的原因和解决方法
2020/12/02 Vue.js
解决基于 keep-alive 的后台多级路由缓存问题
2020/12/23 Javascript
Python通过select实现异步IO的方法
2015/06/04 Python
Python解惑之整数比较详解
2017/04/24 Python
Python2.7编程中SQLite3基本操作方法示例
2017/08/09 Python
django celery redis使用具体实践
2019/04/08 Python
python实现爬虫抓取小说功能示例【抓取金庸小说】
2019/08/09 Python
Python如何使用PIL Image制作GIF图片
2020/05/16 Python
python使用matplotlib的savefig保存时图片保存不完整的问题
2021/01/08 Python
River Island美国官网:英国高街时尚品牌
2018/09/04 全球购物
先进工作者获奖感言
2014/02/08 职场文书
公司接待方案
2014/03/08 职场文书
农村产权制度改革实施方案
2014/03/21 职场文书
代办社保委托书范文
2014/10/06 职场文书
公司离职证明标准格式
2014/11/18 职场文书
《桂花雨》教学反思
2016/02/19 职场文书
Redis实现订单自动过期功能的示例代码
2021/05/08 Redis
详解Java实现设计模式之责任链模式
2021/06/23 Java/Android
Redis如何实现分布式锁
2021/08/23 Redis
nginx lua 操作 mysql
2022/05/15 Servers
pnpm对npm及yarn降维打击详解
2022/08/05 Javascript