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 相关文章推荐
Ucren Virtual Desktop V2.0
Nov 07 Javascript
JS 动态加载脚本的4种方法
May 05 Javascript
JQuery 学习笔记 element属性控制
Jul 23 Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
Oct 14 Javascript
JavaScript函数定义的常见注意事项小结
Sep 16 Javascript
BootStrap modal模态弹窗使用小结
Oct 26 Javascript
Ionic + Angular.js实现验证码倒计时功能的方法
Jun 12 Javascript
vue-cli扩展多模块打包的示例代码
Apr 09 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
Aug 22 Javascript
vue-cli 3 全局过滤器的实例代码详解
Jun 03 Javascript
Angular处理未可知异常错误的方法详解
Jan 17 Javascript
vue3.0 自适应不同分辨率电脑的操作
Feb 06 Vue.js
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
火车头discuz6.1 完美采集的php接口文件
2009/09/13 PHP
深入解析PHP 5.3.x 的strtotime() 时区设定 警告信息修复
2013/08/05 PHP
详解WordPress中分类函数wp_list_categories的使用
2016/01/04 PHP
PHP类相关知识点实例总结
2016/09/28 PHP
PHP简单获取随机数的常用方法小结
2017/06/07 PHP
JavaScript中常用的运算符小结
2012/01/18 Javascript
js分解url参数(面向对象-极简主义法应用)
2012/08/09 Javascript
js监听滚动条滚动事件使得某个标签内容始终位于同一位置
2014/01/24 Javascript
JavaScript实现找质数代码分享
2015/03/24 Javascript
nodejs调用cmd命令实现复制目录
2015/05/04 NodeJs
js实现正则匹配中文标点符号的方法
2015/12/23 Javascript
微信小程序 教程之数据绑定
2016/10/18 Javascript
JavaScript截屏功能的实现代码
2017/07/28 Javascript
用vue封装插件并发布到npm的方法步骤
2017/10/18 Javascript
Vue入门之数据绑定(小结)
2018/01/08 Javascript
vuex进阶知识点巩固
2018/05/20 Javascript
解决vue打包css文件中背景图片的路径问题
2018/09/03 Javascript
对layui数据表格动态cols(字段)动态变化详解
2019/10/25 Javascript
如何在现代JavaScript中编写异步任务
2021/01/31 Javascript
[52:41]OG vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/20 DOTA
Python面向对象编程基础解析(一)
2017/10/26 Python
python模拟预测一下新型冠状病毒肺炎的数据
2020/02/01 Python
利用python批量爬取百度任意类别的图片的实现方法
2020/10/07 Python
使用python tkinter开发一个爬取B站直播弹幕工具的实现代码
2021/02/07 Python
css3 中的新特性加强记忆详解
2016/04/16 HTML / CSS
用html5绘制折线图的实例代码
2016/03/25 HTML / CSS
HTML5声音录制/播放功能的实现代码
2018/05/03 HTML / CSS
世界上最大的各式箱包网络零售店:eBag
2016/07/21 全球购物
美国沃尔玛网上超市:Walmart
2020/08/14 全球购物
武汉东之林科技有限公司机试
2013/09/17 面试题
工程师自我评价怎么写
2013/09/19 职场文书
十佳护士获奖感言
2014/02/18 职场文书
迎新生标语大全
2014/10/06 职场文书
三八妇女节标语
2014/10/09 职场文书
2014年团总支工作总结
2014/11/21 职场文书
职称评定个人总结
2015/03/05 职场文书