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 相关文章推荐
JavaScript 继承详解(四)
Jul 13 Javascript
JavaScript 学习笔记(四)
Dec 31 Javascript
火狐textarea输入法的bug的触发及解决
Jul 24 Javascript
基于mouseout和mouseover等类似事件的冒泡问题解决方法
Nov 18 Javascript
jquery.form.js实现将form提交转为ajax方式提交的方法
Apr 07 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
jQuery实现分隔条左右拖动功能
Nov 21 Javascript
JavaScript转换数据库DateTime字段类型方法
Jun 27 Javascript
浅谈pc端rem字体设置的问题
Aug 03 Javascript
给localStorage设置一个过期时间的方法分享
Nov 06 Javascript
原生JS实现随机点名项目的实例代码
Apr 30 Javascript
element-ui中el-upload多文件一次性上传的实现
Dec 02 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
cache_lite试用
2007/02/14 PHP
Search File Contents PHP 搜索目录文本内容的代码
2010/02/21 PHP
php源码分析之DZX1.5字符串截断函数cutstr用法
2015/06/17 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
javascript 事件查询综合 推荐收藏
2010/03/10 Javascript
javascript实现密码强度显示
2015/03/18 Javascript
JavaScript实现页面跳转的方式汇总
2016/05/16 Javascript
AngularJS实现网站换肤实例
2021/02/19 Javascript
js实现打地鼠小游戏
2017/02/13 Javascript
js实现导航吸顶效果
2017/02/24 Javascript
jQuery动态追加页面数据以及事件委托详解
2017/05/06 jQuery
angular实现IM聊天图片发送实例
2017/05/08 Javascript
如何使用JS在HTML中自定义字符串格式化
2017/07/20 Javascript
基于vue开发的在线付费课程应用过程
2018/01/25 Javascript
antd组件Upload实现自己上传的实现示例
2018/12/18 Javascript
通过实例了解js函数中参数的传递
2019/06/15 Javascript
JavaScript实现图片放大镜效果
2019/06/27 Javascript
跟老齐学Python之折腾一下目录
2014/10/24 Python
Python Flask-web表单使用详解
2017/11/18 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
python之文件读取一行一行的方法
2018/07/12 Python
python实现自动解数独小程序
2019/01/21 Python
pybind11和numpy进行交互的方法
2019/07/04 Python
python实现统计代码行数的小工具
2019/09/19 Python
css3 中的新特性加强记忆详解
2016/04/16 HTML / CSS
Michael Kors美国官网:美式奢侈生活风格的代表
2016/11/25 全球购物
"火柴棍式"程序员面试题
2014/03/16 面试题
冰淇淋店创业计划书范文
2013/12/27 职场文书
民生工作实施方案
2014/05/31 职场文书
2014年领导班子工作总结
2014/12/11 职场文书
小学语文教师竞聘演讲稿范文
2019/08/09 职场文书
SQL Server2019数据库之简单子查询的具有方法
2021/04/27 SQL Server
MySQL 自定义变量的概念及特点
2021/05/13 MySQL
MYSQL如何查看进程和kill进程
2022/03/13 MySQL
python实现会员管理系统
2022/03/18 Python
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python