easyui_动态添加隐藏toolbar按钮

在加载datagrid的时候,我们可以控制toolbar按钮的隐藏或者展现。

toolbar : [{
							text : '添加',
							iconCls : 'icon-add',
							handler : addFun
						}, '-', {
							text : '保存',
							iconCls : 'icon-save',
							handler : saveFun
						}, '-', {
							text : '撤销',
							iconCls : 'icon-redo',
							handler : cancelFun
						}, '-', {
							text : '删除',
							iconCls : 'icon-remove',
							handler : delFun
						} , '-', {
							 id : 'view',
							 text : '查看图片',
							 iconCls : 'icon-edit',
							 handler : viewFun
						 }, '-', {
							 id : 'update',
							 text : '修改图片',
							 iconCls : 'icon-edit',
							 handler : updateFun
						 }
				]

onBeforeLoad: function(data){
					if(v_grid !="#detail"){
						$("div.datagrid-toolbar [id ='view']").eq(0).hide();
						$("div.datagrid-toolbar [id ='update']").eq(0).hide();
					}
				}

注意:div.datagrid-toolbar和 [id ='view'] 之前有一个空格。 没有空格则无效果

发布了37 篇原创文章 · 获赞 28 · 访问量 14万+
展开阅读全文

jquery easyui 1.3.4 的datagrid无法自适应高度和宽度,

08-29

<!-- <div class="easyui-tabs" fit="true" border="false"> <div title="用户管理" border="false"> <!-- --> <div id="searchpanel" class="easyui-panel" border="false" title="查询条件" style="height: 100px;" data-options="iconCls:'icon-search', collapsible:true"> <table class="tableForm datagrid-toolbar" style="width: 100%; height: 100%;"> <tr> <th> 用户名 </th> <td> <input name="userName" style="width: 155px" /> </td> <th> 联系电话 </th> <td> <input name="phone" style="width: 155px" /> </td> <th> 所属单位 </th> <td> <input name="phone" style="width: 155px" /> </td> </tr> <tr> <th> 开始日期 </th> <td> <input name="timeStart" editable="flase" class="easyui-datetimebox" style="width: 155px" /> </td> <th> 结束日期 </th> <td> <input name="timeEnd" editable="flase" class="easyui-datetimebox" style="width: 155px" /> </td> <th></th> <td> <a href="#" class="easyui-linkbutton">查询</a> <a href="#" class="easyui-linkbutton">清空</a> </td> </tr> </table> </div> <table id="centerDateGrid"> <thead> <tr> <th field="userId" width="80" sortable="true"> userId </th> <th field="loginName" width="100" sortable="true"> loginName </th> <th field="userName" width="80" sortable="true"> userName </th> <th field="password" width="80" align="right" sortable="true"> password </th> <th field="cell" width="80" align="right" sortable="true"> cell </th> <th field="qq" width="100" align="right" sortable="true"> qq </th> <th field="mail" width="110" sortable="true"> mail </th> </tr> </thead> </table> </div> </div> --> 这是我的center里面的代码 下面是我的js代码: $(function() { alert("进来了"); //初始化查询pannel // 初始化右下角的提示框 $.messager.show({ title : '我的消息', msg : '登录成功,欢迎使用此系统', timeout : 3000, showType : 'slide' }); // 初始化datagrid $("#centerDateGrid").datagrid({ url : 'login/users!findList.action', height:"200px;", iconCls : 'icon-save',// 图标 rownumbers : true,// 如果为true,则显示一个行号列。 singleSelect : true,// 如果为true,则只允许选择一行。 // autoRowHeight:false,//定义设置行的高度,根据该行的内容。设置为false可以提高负载性能。 nowrap : false,// 如果为true,则在同一行中显示数据。设置为true可以提高加载性能。 pagination : true,// 显示分页工具条 pageSize : 20,// 每页条数 fit : true,// datagrid自适应宽高 fitColumns : true,// 使列自动展开/收缩到合适的数据表格宽度。 idField : 'userId', sortName : 'userId',// 定义哪些列可以进行排序 sortOrder : 'asc',// 定义列的排序顺序,只能是'asc'或'desc' border : false, pageList : [ 20, 30, 40, 50 ],// 分页条数选择 toolbar : [ { text : '添加', iconCls : 'icon-add', hander : function() { } },'-', { text : '修改', iconCls : 'icon-edit', hander : function() { } },'-', { text : '删除', iconCls : 'icon-remove', hander : function() { } } ] //toolbar:"#toolbar" }); }); //查询条件 function search(){ $("#centerDateGrid").datagrid("load",{ userName("#userName").val() }); } //清空查询条件 function clear(){ } 问答

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览