(转)combogrid的代码实例

最新推荐文章于 2017-09-17 16:38:00 发布
最新推荐文章于 2017-09-17 16:38:00 发布
阅读量89 收藏
点赞数
文章标签： xhtml json javascript ViewUI
原文链接：http://www.cnblogs.com/solocao/p/3670214.html
版权

EasyUI中combogrid的代码实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>combogrid</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script>
$(function(){
$("#cc").combogrid({
panelWidth:400,
value:'safds',//缺省值
idField:"code",
textField:"name",
url:"datagrid_data.json",
columns:[[
{field:'code',title:'Code',width:60},
{field:'name',title:'Name',width:100},
{field:'addr',title:'Address',width:120},
{field:'col4',title:'Col41',width:100}
]]
});
});
//重新加载数据源
function reload(){
$('#cc').combogrid('grid').datagrid('reload');
}

//设置select中的值
function setValue(){
$("#cc").combogrid("setValue","003");
}
//获取下拉列表中选择的值
function getValue(){
var val = $('#cc').combogrid('getValue');
alert(val);
}
//禁用组件
function disable(){
$('#cc').combogrid('disable');
}
//启用组件
function enable(){
$('#cc').combogrid('enable');
}
//获取选中的表格的数据
function getGridValue(){
var grid=$("#cc").combogrid("grid");//获取表格对象
var row = grid.datagrid('getSelected');//获取行数据
alert("选择的grid中的数据如下：code:"+row.code+" name:"+row.name+" addr:"+row.addr+" col4:"+row.col4);
}
function clear(){
$("#cc").combogrid("clear");
}
</script>
</head>

<body>
<h3>combogrid</h3>
<div style="margin:10px 0;">
<a href="#" class="easyui-linkbutton" οnclick="reload()">Reload</a>
<a href="#" class="easyui-linkbutton" οnclick="setValue()">SetValue</a>
<a href="#" class="easyui-linkbutton" οnclick="getValue()">GetValue</a>
<a href="#" class="easyui-linkbutton" οnclick="getGridValue()">GetGridValue</a>
<a href="#" class="easyui-linkbutton" οnclick="disable()">Disable</a>
<a href="#" class="easyui-linkbutton" οnclick="enable()">Enable</a>
<a href="#" class="easyui-linkbutton" οnclick="clear()">clear</a>
</div>
<select id="cc" class="easyui-combogrid" style="width:250px;"></select>
</body>
</html>

 

 

转载于:https://www.cnblogs.com/solocao/p/3670214.html

weixin_30552635
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue-easyui ComboGrid 输入是过滤下拉框中的数据
qq_41863865的博客
06-12 587
Vue-easyui ComboGrid 输入是过滤下拉框中的数据 找了一些实例没有实现我的要求，就硬着头皮根据官方文档，实例看了下载的模块代码，最后终于实现了，不知道有没有其他的影响 1.ComboGrid 设置为可输入的（editable=“true” ），文本框中输入的为过滤值(filterValue)，添加过滤值更改事件的函数（filterChange），使用ref标识 <ComboGrid :valueField="coset[item.column_name]['录入值列']" :text
快速开发之代码生成器（asp.net mvc4 + easyui + knockoutjs）
Java_c#
04-21 1200
推荐阅读：https://www.cnblogs.com/ymnets/p/3424309.html EF 表必须要有主键,否则从数据库更新模型，添加不进去 https://www.cnblogs.com/flish/p/8143891.html EasyUI+Knockout实现经典表单的查看、编辑 ASP.NET MVC5+EF6+EasyUI 后台管理系统 T4学习 ...
EasyUI ComboGrid 集成分页、按键示例
04-27
asyUI ComboGrid 集成分页、按键示例源码 源码描述： 实现的功能： 1、下拉框下拉时出现表格； 2、表格带分页功能； 3、可以使用向上键、向下键在表格中移动选择行数据； 4、可以使用回车键在表格中选中行数据； 5、在下拉框的文本框中输入内容，能查询表格； 6、下拉框的文本框的内容变化时，表格数据按分页设置显示 所用技术：jquery+在html页面中通过js文件调用ashx一般处理程序 运行环境：vs2010+无数据库
EasyUI中combogrid的代码实例
weixin_30246221的博客
12-31 87
此文为网络摘取……来自csdn cjz_huateng的专栏 <script> $(function(){ $("#cc").combogrid({ panelWidth:400, value:'safds',//缺省值 idField:"code", textField:"name", url:"datagrid_data.json...
easyui源码翻译1.32--ComboGrid（数据表格下拉框）
weixin_30915951的博客
12-28 116
前言 扩展自$.fn.combo.defaults和$.fn.datagrid.defaults。使用$.fn.combogrid.defaults重写默认值对象。下载该插件翻译源码 数据表格下拉框结合了可编辑文本框控件和下拉数据表格面板控件，该控件允许用户快速查找和选择，并且该控件提供了键盘导航支持，对行进行筛选 源码 /** * jQuery EasyUI 1.3.2...
EasyUI ComboGrid
04-11
1、下拉框下拉时出现表格； 2、表格带分页功能； 3、可以使用向上键、向下键在表格中移动选择行数据； 4、可以使用回车键在表格中选中行数据； 5、在下拉框的文本框中输入内容，能查询表格； 6、下拉框的文本框的内容变化时，表格数据按分页设置显示
EasyUI中包选择按钮的下拉列表的代码实例(可多选值)
cjz_huateng的专栏
05-30 8531
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> 包含选择按钮的下拉列表(可多选) $(function(){ $('#cc').combo({ required:true, editable:true, multiple:tru
简介EasyUI datagrid editor combogrid搜索框的实现
11-22
这样，我们就可以通过`.combogrid-f`类找到所有的Combogrid实例，然后设置查询参数并重新加载数据，实现了在DataGrid编辑器中的Combogrid搜索功能。 总结来说，本文详细讲解了如何在EasyUI DataGrid中扩展Combogrid...
Extjs4 combogrid扩展
07-28
1. **GridComboBox.js**：这个文件很可能是实现combogrid扩展的主要代码。它可能包含了一个自定义的Ext.Component，继承自原生的Ext.form.field.ComboBox，并添加了显示grid的功能。可能包括了创建grid、设置数据源...
EasyUI实现下拉框多选功能
01-19
本文实例为大家分享了EasyUI实现下拉框多选展示的具体代码，供大家参考，具体内容如下 效果图： 这个没什么说的，直接引入css和js文件和图片，调用js即可。下面是源码： <html> <head> <meta ...
Easyui Datagrid 的Combobox 如何动态修改下拉选项，以及值的转换
weixin_30713953的博客
09-17 648
我是先将下拉选项的值通过datagrid的url查出来了，在每一行的row中 //项目结果选项卡的列表 $('#project_table').datagrid({ width : '100%', height: '378', url : 'getSeparationProjectInf', //title : '待分发条码列表'...
ComboGrid( 数据表格下拉框)
12-03 443
一． 加载方式//class 加载方式<select id="box" class="easyui-combogrid" name="dept"style="width:250px;"data-options="panelWidth:450,value:'请选择一个值',idField:'id',textField:'user',url:'content.json',columns...
如何获取grid的总行数
祥子的博客
02-06 5581
1. grid.getStore().getCount(); //未分页时 , 获取总行数 2. grid.getStore().getTotalCount(); //存在分页时 , 获取总行数 3. grid.getView().getRows().length; grid.getView().getRows() : 返回所有行,这些行不是ExtJS的封装类对象,而是TR元素对象,只能通过dom访
Easyui - 一个比较复杂的ComboGrid（数据表格下拉框）单选的例子
偶尔记一下 - mybatis.io
12-20 1万+
由于某种情况下，使用ComboGrid的时候比较多，为了方便以后使用的时候方法查找，在这里记录一下。 适用场景：单项选择，自动完成，看下面的效果图。 先看一个效果图： 这里输入助记码的时候就显示出窗口了。 然后鼠标点击选择一个： 这个同时更新了多个输入框的值，并且没有使用默认的选择事件。   前端代码： 收费项目名称[*]：
EasyUI中combobox的代码实例
热门推荐
cjz_huateng的专栏
05-30 4万+
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> combobox //动态加载数据集文件数据 function loadData(){ $('#cc').combobox({ url:'combobox_data.json',
Easyui - 一个比较复杂的ComboGrid（数据表格下拉框）多选的例子
偶尔记一下 - mybatis.io
12-20 1万+
由于某种情况下，使用ComboGrid的时候比较多，为了方便以后使用的时候方便查找，在这里记录一下。 适用场景：多项选择，自动完成，看下面的效果图。 效果图： 由于需要多选，因此不能在原来的输入框中通过逗号隔开输入多项实现，所以在弹出的datagrid中增加了一个输入框，并且增加了一个清空已选内容的按钮。   前端代码：
EasyUI中combogrid的使用方法
cjz_huateng的专栏
06-02 4万+
ComboGrid用法和参数配置 1、 需要引入class=" "easyui-combogrid”，必须应用在input或select元素中 2、 参数设置需要在data-options中设置 3、 属性参数配置： loadMsg：加载远程数据，显示的信息 idField：select中选择提交值 textField：select中选择的显示值 mode：定义如何加载DataGri
CYPRESS USB3.0 SDK实例代码解析与关键函数解读
"CYPRESS USB3.0实例代码解读，主要关注CYPRESS的FX3 SDK中的slaveFifoSync同步FIFO示例，适合USB3.0软件开发工程师和学者学习。\n\n在USB 3.0开发中，CYPRESS的FX3 SDK提供了丰富的功能，其中同步FIFO的例子...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值