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

请输入您要查询的考试资料:

 

标题 Easyui 之 Treegrid 笔记
内容
    easyui是一种基于jQuery的用户界面插件集合。本文是小编自己遇到的一些有关easyui treegrid的问题记录,特此分享脚本之家平台供大家参考
    EasyUI 简介
    easyui是一种基于jQuery的用户界面插件集合。
    easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。
    使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。
    easyui是个完美支持HTML5网页的完整框架。
    easyui节省您网页开发的时间和规模。
    easyui很简单但功能强大的。
    菜鸟初次使用,参考论坛中介绍的方法仍走了一些弯路,把自己遇到的问题记录下来。
    1.必须定义根节点;
    2.根节点一个或多个均可;
    4.根节点的父节点属性不必定义,或者定义为0;
    5.各级子节点的父节点属性名称必须为“_parentId",不能用其它名称,此名称已在jquery.easyui.js中定义;
    6.不必在后台ACTION中输出“树”形结构的json数据,只要下面结构的json给前台的treegrid,就可以建立树形输出到页面。(了解到后台以树形children格式输出也是一种选择。)
    {"total":17,"rows":[
    {"id":3,"goodsid":36120,"Qty":2.0000,"Rem":"15"},{"id":4,"goodsid":36123,"Qty":1.0000,"Rem":"21"},{"id":5,"goodsid":36124,"Qty":2.0000,"Rem":"23"},{"id":8,"goodsid":36130,"Qty":1.0000,"Rem":"1"},{"id":9,"goodsid":36131,"Qty":1.0000,"Rem":"2"},{"id":10,"goodsid":36132,"Qty":1.0000,"Rem":"3"},{"id":11,"goodsid":36133,"Qty":1.0000,"Rem":"4"},{"id":12,"goodsid":36134,"_parentId":8,"Qty":1.0000,"Rem":"1"},{"id":13,"goodsid":36135,"_parentId":8,"Qty":2.0000,"Rem":"2"},{"id":14,"goodsid":36136,"_parentId":8,"Qty":1.0000,"Rem":"3"},{"id":15,"goodsid":36137,"_parentId":8,"Qty":1.0000,"Rem":"4"},{"id":16,"goodsid":36138,"_parentId":8,"Qty":3.0000,"Rem":"5"},{"id":17,"goodsid":36139,"_parentId":8,"Qty":1.0000,"Rem":"6"},{"id":18,"goodsid":36142,"_parentId":9,"Qty":1.0000,"Rem":"1"},{"id":19,"goodsid":36143,"_parentId":9,"Qty":1.0000,"Rem":"2"},{"id":20,"goodsid":36144,"_parentId":9,"Qty":1.0000,"Rem":"3"},{"id":21,"goodsid":36145,"_parentId":9,"Qty":1.0000,"Rem":"4"}
    ]}
    这是Action
    var pls = ListAll(p.PartChild).ToList();
    List<Object> result = new List<object>();
    foreach(var item in pls)
    {
    if(item.PartParent == p.PartChild)
    {
    result.Add( new { id = item.ListID, goodsid = item.PartChild, Qty = item.Qty, Rem = item.Rem });
    //下面是调用生成树形数据方法的语句,多余!easyui可根据parentID自动建树
    //Object l = new { id = item.ListID, text = item.PartChild, _parentId = 0,Qty = item.Qty, Rem = item.Rem, chlidren = TreeList(pls, item.PartChild) };
    //result.Add(l);
    }
    else
    {
    var parent = from a in pls
    where a.PartChild == item.PartParent
    select a;
    result.Add(new { id = item.ListID, goodsid = item.PartChild, _parentId = parent.First().ListID, Qty = item.Qty, Rem = item.Rem });
    }
    }
    这是前台View
    <div></div>
    <table data-options="
    url:'/ContosoBISite/PartsList/JList/',
    method: 'get',
    nowrap: false,
    rownumbers: true,
    animate: true,
    collapsible: true,
    fitColumns: true,
    idField: 'id',
    treeField: 'goodsid'
    ">
    <thead>
    <tr>
    <th data-options="field:'goodsid'" width="100">goodsid</th>
    <th data-options="field:'id'" width="100">ListID</th>
    <th data-options="field:'ListVer'" width="100">ListVer</th>
    <th data-options="field:'ParentName'" width="100">ParentName</th>
    <th data-options="field:'Qty'" width="50">Qty</th>
    <th data-options="field:'Rem'" width="50">Rem</th>
    <th data-options="field:'_parentId'" width="50">parent</th>
    </tr>
    </thead>
    </table>
    JS版本:jquery.easyui-1.4.3.min.js;jquery-1.11.3.min.js
    以上内容是小编给大家分享的Easyui 之 Treegrid 笔记,希望对大家有所帮助!
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/14 6:13:47