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 相关文章推荐
Jquery 实现Tab效果 思路是js思路
Mar 02 Javascript
jquery图片切换实例分析
Apr 15 Javascript
jQuery使用$.ajax进行即时验证实例详解
Dec 11 Javascript
JavaScript判断数组是否存在key的简单实例
Aug 03 Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
Sep 05 Javascript
基于AngularJS实现iOS8自带的计算器
Sep 12 Javascript
前端分页功能的实现以及原理(jQuery)
Jan 22 Javascript
javascript 的变量、作用域和内存问题
Apr 19 Javascript
用p5.js制作烟花特效的示例代码
Mar 21 Javascript
微信小程序登录数据解密及状态维持实例详解
May 06 Javascript
layer ui插件显示tips时,修改字体颜色的实现方法
Sep 11 Javascript
微信小程序 动态修改页面数据及参数传递过程详解
Sep 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
动漫定律:眯眯眼都是怪物!这些角色狠话不多~
2020/03/03 日漫
不支持fsockopen但支持culr环境下下ucenter与modoer通讯问题
2011/08/12 PHP
php时区转换转换函数
2014/01/07 PHP
让PHP显示Facebook的粉丝数量方法
2014/01/08 PHP
微信公众号开发之微信公共平台消息回复类实例
2014/11/14 PHP
THINKPHP截取中文字符串函数实例代码
2017/03/20 PHP
WordPress 照片lightbox效果的运用几点
2009/06/22 Javascript
jquery中获取元素的几种方式小结
2011/07/05 Javascript
Javascript模块化编程详解
2014/12/01 Javascript
javascript使用shift+click实现选择和反选checkbox的方法
2015/05/04 Javascript
讲解JavaScript中for...in语句的使用方法
2015/06/03 Javascript
jquery判断当前浏览器的实现代码
2015/11/07 Javascript
React-router中结合webpack实现按需加载实例
2017/05/25 Javascript
Express+Nodejs 下的登录拦截实现代码
2017/07/01 NodeJs
AngularJs的$http发送POST请求,php无法接收Post的数据问题及解决方案
2020/08/13 Javascript
解决vue项目中出现Invalid Host header的问题
2020/11/17 Javascript
[42:32]Secret vs Optic 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
浅谈Python的文件类型
2016/05/30 Python
Python科学计算之Pandas详解
2017/01/15 Python
通过python实现弹窗广告拦截过程详解
2019/07/10 Python
Python使用itchat模块实现群聊转发,自动回复功能示例
2019/08/26 Python
python paramiko远程服务器终端操作过程解析
2019/12/14 Python
python列表返回重复数据的下标
2020/02/10 Python
如何使用Python抓取网页tag操作
2020/02/14 Python
python使用QQ邮箱实现自动发送邮件
2020/06/22 Python
python绘制分布折线图的示例
2020/09/24 Python
利用django创建一个简易的博客网站的示例
2020/09/29 Python
跨域修改iframe页面内容详解
2019/10/31 HTML / CSS
Lucene推荐的分页方式是什么?
2015/12/07 面试题
公司薪酬管理制度
2014/01/31 职场文书
优秀员工演讲稿
2014/05/19 职场文书
2014年个人委托书范本
2014/10/13 职场文书
求职意向书范本
2015/05/11 职场文书
欠条格式范本
2015/07/03 职场文书
2021年pycharm的最新安装教程及基本使用图文详解
2021/04/03 Python
python spilt()分隔字符串的实现示例
2021/05/21 Python