MVC4+EasyUI的Web经验总结 easyui-treegrid onBeforeLoad

最新推荐文章于 2021-03-10 17:06:24 发布

敲代码的设计师

最新推荐文章于 2021-03-10 17:06:24 发布

阅读量6.4k

点赞数

分类专栏： easyUI 文章标签： mvc4 easyui

本文链接：https://blog.csdn.net/qinlang193320/article/details/51538358

版权

本文总结了使用MVC4框架配合EasyUI库，特别是针对easyui-treegrid组件在数据加载及点击展开树列表时的操作经验。详细介绍了后端如何通过`Emergency/GetPlanLog`接口实现列表查询，并通过`Emergency/GetStepListByLogID`接口为treegrid提供数据，以便在前端展示。

摘要由CSDN通过智能技术生成

后端URL
Emergency/GetPlanLog(int UserID, DateTime? startTime, DateTime? endTime, int page, int rows)//查询列表

Emergency/GetStepListByLogID(int LogID)//点击展开树列表

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>"%>

<!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 id="Head1" runat="server">
    <title>应急事件历史查询</title>
    <link href="../../App_Themes/Default/all.css" rel="stylesheet" type="text/css" />
     <script type="text/javascript" src="../../Scripts/jquery-1.4.1.min.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../../Scripts/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="../../Scripts/myScript.js"></script>
    <script type="text/javascript">
        var ondate = new Date();
        var endDate = ondate.getFullYear() + "-" + (ondate.getMonth() + 1) + "-" + ondate.getDate() + " 23:59:59"; //开始时间
        var startDate = ondate.getFullYear() + "-" + (ondate.getMonth()) + "-" + ondate.getDate() + " 00:00:00"; //结束时间   往前一个月
        $(function () {
    
            $("#EmergencyList").treegrid({
   //加载树型表格用treegrid   //加载普通的显示列表用datagrid
                title: '应急事件历史列表',
                iconCls: 'icon-save',
                width: 'auto',
                height: 'auto',
                nowrap: false,
                rownumbers: true,//行号
                animate: true,
                collapsible: true,
                pagination: true,
                fitColumns: true, //True就会自动扩大或者缩小列的尺寸以适应表格的宽度并且防止水平滚动
                pageNumber: 1, //初始化页码
                pageSize: 10, //初始化尺寸
                url: '/Emergency/GetPlanLog?UserID=' + getCookie("UserID") + '&startTime=' + startDate + '&endTime=' + endDate + '&page=' + 1 + '&rows=' + 10,
                idField: 'ID',//列表数据中的主键
                treeField: 'Plan