.NET MVC开源工作流系统 - 可视化流程设计器 - 工作流表单设计器 - .NET快速开发平台 - .NET三层代码生成器 - 通用权限管理

.NET MVC CORE开源工作流平台,可视化流程设计器 首页 工作流引擎 MVC版文档 VUE版文档 流程下载 商业授权 典型案例 关于我们
数据表格

数据表格是在表单中显示一个数据列表,展示数据给用户看。

image.png

宽度:表格的宽度。

高度:表格的高度,如果数据行较多,超出高度会显示滚动条。

边框:表格显示的边框。CSS样式,如:1px sold red;同是会显示一个红色边框的表格。

数据来源:表格数据的来源。

        SQL:显示一个SQL查询返回的数据。

        image.png

        该设置运行后效果:

        image.png

        URL:从一个URL地址返回表格数据(URL中可以使用通配符作为URL GET参数)。

        image.png

        返回字符串数据格式:{cols:[{name:'col_1',title:'列1'},{name:'col_2',title:'列2'}],rows:[{col_1:"数据1",col_2:"数据1"},{col_1:"数据2",col_2:"数据2"}]}

        参考示例:

        image.png

表头:可以自定义表头(自定义表头可以设置复杂表头,如合并行列等),默认是根据返回的列名自动生成表头。

        例如这里输入:

        image.png

          <tr>
            <th rowspan="2" style="border:1px solid #f0f2f7">列1</th>
            <th colspan="2" style="border:1px solid #f0f2f7">列2,列3</th>
            <th rowspan="2" style="border:1px solid #f0f2f7">列4</th>
          </tr>
          <tr>
            <th style="border:1px solid #f0f2f7">列2</th>
            <th style="border:1px solid #f0f2f7">列3</th>
          </tr>

        最终显示结果:

        image.png

列宽:自定义每一列的宽度。

    <col width='10%'/><col width='15%'/>....col数量与列数据保持一致。

序号:是否在表第一列显示行号。

        image.png

        如果是自定义的表头,要加上序号列:

          <tr>
            <th rowspan="2"style="border:1px solid #f0f2f7;">#</th>
            <th rowspan="2" style="border:1px solid #f0f2f7">列1</th>
            <th colspan="2" style="border:1px solid #f0f2f7">列2,列3</th>
            <th rowspan="2" style="border:1px solid #f0f2f7">列4</th>
          </tr>
          <tr>
            <th style="border:1px solid #f0f2f7">列2</th>
            <th style="border:1px solid #f0f2f7">列3</th>
          </tr>

          并设置列宽:

        <col width="3%"/><col width="35%"/><col width="15%"/><col width="15%"/><col width="35%"/>


联系QQ:493501010电话:13608325512(微信同号)邮箱:xhb@roadflow.net;493501010@qq.com
Copyright 2014 - 2021 重庆天知软件技术有限公司 版权所有