layui如何将表单数据提交到后台并进行校验？

1.使用layui的form模块来实现表单提交。

2.在表单中设置提交事件，调用form.on方法，监听submit事件。在函数中获取到表单数据，然后将表单数据提交到后台。

3.在后台进行校验，校验成功后返回success，否则返回failed。

以下是一个示例：HTML代码：

<form class="layui-form" action="" lay-filter="formDemo">
  <div class="layui-form-item">
    <label class="layui-form-label">用户名</label>
    <div class="layui-input-inline">
      <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-inline">
      <input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="submitDemo">提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>

JavaScript代码：
 

layui.use(['form', 'layer'], function(){
  var form = layui.form;
  var layer = layui.layer;
  
  //监听提交
  form.on('submit(submitDemo)', function(data){
    //获取表单数据
    var username = data.field.username;
    var password = data.field.password;
    
    //将表单数据提交到后台
    $.post("url/to/backend", {username:username, password:password}, function(resp){
      if(resp == "success"){
        layer.msg("提交成功！");
      }else{
        layer.msg("提交失败！");
      }
    });
    
    return false; //阻止表单提交
  });
});

@RequestMapping(value = "url/to/backend", method = RequestMethod.POST)
@ResponseBody
public String submit(@RequestParam String username, @RequestParam String password){
  if(username.equals("admin") && password.equals("123456")){
    return "success";
  }else{
    return "failed";
  }
}

注意事项：

1.为了实现表单提交，需要在lay-filter属性中设置一个名称，用来绑定表单提交的事件。

2.在表单中设置提交事件，调用form.on方法，监听submit事件，注意返回值一定要为false。

3.后台接收请求，进行校验，返回给前端“success”或“failed”字符串。