# layui-diyForm

**Repository Path**: helpproject/layui-diy-form

## Basic Information

- **Project Name**: layui-diyForm
- **Description**: 一个基于layui的自定义表单
- **Primary Language**: JavaScript
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2023-06-15
- **Last Updated**: 2024-04-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# layui-diyForm

#### 介绍

一个基于layui的自定义表单

#### 代码示例

```JS
<form class="layui-form layui-form-pane">
  <div id="diyForm" style="padding: 10px;"></div>
</form>

const defaultValue = [{ "field": "name", "condition": "like", "connector": "and", "value": "测试" }];
// 自定义查询表单
const diyFormElem = diyForm.render({
  elem: '#diyForm',
  url: "{:url('batchInvokeAction')}",
  params: {'form': 'users_search_form'},
  data: [
    {title: '名称', field: 'name', type: 'text'},
    {title: '性别', field: 'sex', type: 'select', "options": [
      {"caption": "未知", "value": ""},
      {"caption": "男", "value": 1},
      {"caption": "女", "value": 2}
    ]},
  ],
  defaultValue: defaultValue,
  resize: function(data) {
    // 尺寸变化后
  },
  done: async function (data) {
    // 渲染后
  }
})
// 获取数据
diyFormElem.getData()
// 异步设置默认值
diyFormElem.renderForm(defaultValue);
```

#### 展示案例

<!-- 图片 -->
![这是图片](./3ad53ced-fe94-4571-8e86-3ad33b2ae99c.gif "展示案例")