MVC+easyui-datagrid之查看详情

最新推荐文章于 2022-11-15 09:57:57 发布

原创

最新推荐文章于 2022-11-15 09:57:57 发布 · 4.6k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#MVC+easyui-datagrid之

本文介绍了在GXPT项目中如何利用MVC架构和EasyUI的datagrid组件实现查看详情功能。开发者花费两天时间完成此功能，点击查看详情按钮后，能够弹出对应ID的数据内容。具体实现包括View部分的展示。

在做GXPT时，我负责课表这块儿，而这块儿最大的特点是很难用到大家公共的东西，只能自己一点点去做，其中之一就是查看详情，这个功能我做了大概有两天时间，下面是我做的成果：

点击查看详情后，要弹出对应ID 的内容，如下：

下面看一下这个功能的具体实现：

先看View:

<span style="font-size:14px;"><table id="dgTimeTable" class="easyui-datagrid" style="position: relative;height:auto;" data-options="url:'/BasicTimeTable/QueryTimeTable/',checkbox:true,resizable:true,collapsible:true,method:'get',autoColWidth:true,pageSize:10,rownumbers:true,pagination:'true',fitColumns:true">
                <thead>
                    <tr>
                        <th data-options="field:'ck',checkbox:true"></th>
                        <th data-options="field:'TimeTableID',hidden:true">课表ID</th>
                        <th data-options="field:'OnClassName',hidden:true">上课班名称</th>
                        <th data-options="field:'CourseName'">课程名称</th>
                        <th data-options="field:'Cycle'">周期</th>
                        @*<th data-options="field:'weekly',width:100">周次</th>*@
                        <th data-options="field:'StratWeek'">开始周</th>
                        <th data-options="field:'EndWeek'">结束周</th>
                        <th data-options="field:'StartSectionName'">开始节次</th>
                        <th data-options="field:'EndSectionName'">结束节次</th>