数据列表df-datagrid和模态框df-dialog

最新推荐文章于 2022-06-16 07:33:32 发布

dunfee丶69

最新推荐文章于 2022-06-16 07:33:32 发布

阅读量227

点赞数

文章标签：学习

本文链接：https://blog.csdn.net/u013955822/article/details/89282238

版权

本文介绍了如何根据开发需求封装数据列表组件df-datagrid和模态框组件df-dialog。df-datagrid用于以表格形式展示数据，支持数据刷新、查询和获取行数据。df-dialog则是一个JavaScript创建的对话框，支持自定义按钮。提供了demo.html示例和代码获取方式。

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

介绍

根据平时开发的需求，自定义封装一个数据列表df-datagird和一个模态框df-dialog。

查看示例

demo.html

获取代码

git clone https://github.com/dunfee1994/df-datagrid.git

df-datagrid

1、数据列表，以表格形式展示数据。主要通过JavaScript去创建df-datagrid组件。

<!-- 数据列表（DOM）元素 -->
<div id="datagrid" class="df-datagrid">
    <!-- 数据列表条件搜索的条件 -->
    <div class="df-datagrid-searchbox">
        <select id="keyWord1">
            <option value="-1">类型</option>
            <option value="1">商家端</option>
            <option value="2">买手端</option>
        </select>
        <select id="keyWord2">
            <option value="-1">等级</option>
            <option value="1">一级</option>
            <option value="2">二级</option>
        </select>
        <select id