Easyui Treegrid改变默认图标的方法

前端之家收集整理的这篇文章主要介绍了Easyui Treegrid改变默认图标的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

普通情况下,treegrid的图标是默认的文件夹与文件的形式,如下图:

​​​我们可以在json文本中加入iconCls来改变默认图标,例如样例中:

然后修改icon.css以及将要用到的图标放在指定的文件夹。

通常情况下,讲过这样的修改,treegrid就可以显示出你自己设计的图标了。

​如果此时还不能显示出你设定的图标,可以查看一下页面中引入icon.css以及easyui.css的顺序,要保证easyui.css在前,icon.css在后。否则,easyui.css中的样式就会将icon.css覆盖点,依旧显示默认图标。

下面给大家介绍jQuery EasyUI treegrid 增删改查代码

' '
'; return s; } else { return ''; } } var editingId; function deleteRow(){ if (editingId != undefined){ $('#tg').treegrid('select',editingId); return; } var row = $('#tg').treegrid('getSelected'); if (row){ editingId = row.id $('#tg').treegrid('remove',editingId); $('#tg').treegrid('reloadFooter'); } $(".actionbtn").toggleClass("l-btn-disabled"); } function edit(){ if (editingId != undefined){ $('#tg').treegrid('select',editingId); return; } var row = $('#tg').treegrid('getSelected'); if (row){ editingId = row.id $('#tg').treegrid('beginEdit',editingId); } $(".actionbtn").toggleClass("l-btn-disabled"); } function insert(){ if (editingId != undefined){ $('#tg').treegrid('select',editingId); return; } /**/ var rows = $('#tg').treegrid('getChildren'); editingId = rows.length+1; var row = null; var _data = {"id":editingId,"name":"new name","persons":0,"progress":10}; var _parentId = 0; var row = $('#tg').treegrid('getSelected'); if (row){ $('#tg').treegrid('expand',row.id); _parentId = row.id; }else{ var root = $('#tg').treegrid('getRoot'); _parentId = null; } $('#tg').treegrid('append',{ parent: _parentId,// 这里指定父级标识就可以了 data: [_data] }); $('#tg').treegrid('beginEdit',_data.id); $(".actionbtn").toggleClass("l-btn-disabled"); } function save(){ if (editingId != undefined){ var t = $('#tg'); t.treegrid('endEdit',editingId); editingId = undefined; var persons = 0; var rows = t.treegrid('getChildren'); for(var i=0; i

猜你在找的JavaScript相关文章