layui form表单赋值
时间: 2023-08-15 14:08:51 浏览: 174
在 layui 中,可以使用 `form.val(formFilter, data)` 方法为表单元素赋值。其中,`formFilter` 为表单的过滤器,`data` 为要赋的值,可以是一个 JSON 对象。
示例代码如下:
```html
<form class="layui-form" lay-filter="test">
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="username" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
</div>
</div>
</form>
```
```javascript
// 给表单赋值
var data = {
username: 'admin',
password: '123456'
};
layui.form.val('test', data);
```
在以上示例中,我们为一个带有用户名和密码输入框的表单赋值,其中 `test` 是表单的过滤器,`data` 是要赋的值。
阅读全文
相关推荐













<script type="text/html" id="toolDemo"> 编辑 删除 <form class="layui-form" id="editForm"> <input type="hidden" name="ID" id="ID"> <label class="layui-form-label">员工账号</label> <input type="text" name="UserCode" required lay-verify="required" class="layui-input"> <label class="layui-form-label">员工姓名</label> <input type="text" name="UserName" required lay-verify="required" class="layui-input"> <label class="layui-form-label">性别</label> <input type="radio" name="Sex" value="true" title="男" checked> <input type="radio" name="Sex" value="false" title="女"> <label class="layui-form-label">出生日期</label> <input type="text" name="BirthDay" id="BirthDay" class="layui-input"> <label class="layui-form-label">邮箱</label> <input type="text" name="Email" class="layui-input"> <label class="layui-form-label">电话</label> <input type="text" name="Tel" class="layui-input"> <label class="layui-form-label">地址</label> <input type="text" name="Address" class="layui-input"> <label class="layui-form-label">状态</label> <input type="checkbox" name="Status" lay-skin="switch" lay-text="离职|在职"> <button class="layui-btn" lay-submit lay-filter="saveBtn">保存</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </form> </script> </fieldset> <script> var tableIns; var form; var isEdit; layui.use(['table', 'form',], function () { var table = layui.table; form = layui.form; // 修正:移除重复的var声明 // 创建渲染实例 tableIns = table.render({ elem: '#test', url: '/UserManagem/GetList', page: true, cols: [[ { type: 'checkbox', width: '5%', title: '' }, { type: 'numbers', width: '5%', title: '序号' }, { field: 'UserCode', width: '8%', title: '员工账号' }, { field: 'UserName', width: '8%', title: '员工姓名' }, { field: 'Sex', width: '8%', title: '性别', templet: function (d) { if (d.Sex == true) { return "男" } else { return "女"; } } }, { field: 'BirthDay', width: '8%', title: '出生日期', templet: function (d) { return convertJsonDate(d.BirthDay); } }, { field: 'BirthDay', width: '8%', title: '年龄', templet: function (d) { return calculateAge(d.BirthDay); } }, { field: 'Status', width: '8%', title: '是否离职', templet: function (d) { if (d.Status == true) { return "离职"; } else { return "在职"; } } }, { field: 'Email', width: '8%', title: '邮箱' }, { field: 'Tel', width: '8%', title: '电话' }, { field: 'CreateDate', width: '8%', title: '创建时间', templet: function (d) { return convertJsonDate(d.CreateDate); } }, { field: 'Address', width: '8%', title: '员工住址' }, { title: '操作', width: '10.5%', templet: '#toolDemo' } ]], done: function (res, curr, count) { // 数据渲染完成后的回调 if (res.code !== 0) { // 假设0是成功状态码 layer.msg('数据加载失败: ' + res.msg, { icon: 5 }); } }, error: function () { // 请求错误的回调 layer.msg('网络请求错误,请检查接口', { icon: 5 }); } });检查这段代码




