Layui Form Initialization Guide

In layui form, you can use the form.val() method to initialize form values. The specific steps are as follows:

  1. Import the layui library file.
<link rel="stylesheet" href="path/to/layui/css/layui.css">
<script src="path/to/layui/layui.js"></script>
  1. Write code for the form
<form class="layui-form" action="">
  <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>
  <div class="layui-form-item">
    <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
  </div>
</form>
  1. Initialize form values using the form.val() method.
layui.use('form', function(){
  var form = layui.form;
  
  // 初始化表单赋值
  form.val('formDemo', {
    "username": "test",
    "password": "123456"
  });
});

The method form.val(‘formDemo’, data) in the above code will assign the data in the data object to the input box corresponding to the name attribute in the form. This way, form data can be automatically filled when the page loads.

bannerAds