网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的范文：

　

标题 Easyui Treegrid改变默认图标的方法
范文
    这篇文章主要介绍了Easyui Treegrid改变默认图标的方法的相关资料,需要的朋友可以参考下
    普通情况下，treegrid的图标是默认的文件夹与文件的形式，如下图：
    名单
    我们可以在json文本中加入iconCls来改变默认图标，例如样例中：
    {"total":7,"rows":[
    {"id":1,"name":"All Tasks","begin":"3/4/2010","end":"3/20/2010","progress":60,"iconCls":"icon-ok"},
    {"id":2,"name":"Designing","begin":"3/4/2010","end":"3/10/2010","progress":100,"_parentId":1,"state":"closed"},
    {"id":21,"name":"Database","persons":2,"begin":"3/4/2010","end":"3/6/2010","progress":100,"_parentId":2},
    {"id":22,"name":"UML","persons":1,"begin":"3/7/2010","end":"3/8/2010","progress":100,"_parentId":2},
    {"id":23,"name":"Export Document","persons":1,"begin":"3/9/2010","end":"3/10/2010","progress":100,"_parentId":2},
    {"id":3,"name":"Coding","persons":2,"begin":"3/11/2010","end":"3/18/2010","progress":80},
    {"id":4,"name":"Testing","persons":1,"begin":"3/19/2010","end":"3/20/2010","progress":20}
    ],"footer":[
    {"name":"Total Persons:","persons":7,"iconCls":"icon-sum"}
    ]}
    然后修改icon.css以及将要用到的图标放在指定的文件夹。
    通常情况下，讲过这样的修改，treegrid就可以显示出你自己设计的图标了。
    名单
    如果此时还不能显示出你设定的图标，可以查看一下页面中引入icon.css以及easyui.css的顺序，要保证easyui.css在前，icon.css在后。否则，easyui.css中的样式就会将icon.css覆盖点，依旧显示默认图标。
    下面给大家介绍jQuery EasyUI treegrid 增删改查代码
    <script type="text/javascript">
    function formatProgress(value){
    if (value){
    var s = '<div>' +
    '<div>' + value + '%' + '</div>'
    '</div>';
    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,"begin":"3/19/2010","end":"3/20/2010","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<rows.length; i++){
    var p = parseInt(rows[i].persons);
    if (!isNaN(p)){
    persons += p;
    }
    }
    var frow = t.treegrid('getFooterRows')[0];
    frow.persons = persons;
    t.treegrid('reloadFooter');
    $(".actionbtn").toggleClass("l-btn-disabled");
    }
    }
    function cancel(){
    if (editingId != undefined){
    $('#tg').treegrid('cancelEdit', editingId);
    editingId = undefined;
    }
    $(".actionbtn").toggleClass("l-btn-disabled");
    }
    </script>
    <div>
    <a href="javascript：void(0)" disabled="disabled" onclick="save()">Save</a>
    <a href="javascript：void(0)" disabled="disabled" onclick="cancel()">Cancel</a>
    </div>
随便看

　

在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板，是学习及工作的有利工具。

　

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间：2025/5/18 1:31:32