layui hidden域无法提交的根本原因是未通过form.val()赋值或缺少name属性、未置于lay-filter表单内；必须同时满足type="hidden"、有name属性、在lay-filter表单中、且用form.val()赋值。

layui 表单中 hidden 域无法提交的常见原因

不是 layui 本身阻止 hidden 提交，而是你用错了方式：直接操作 DOM 的 value 属性或用原生 JS 赋值后，layui 的表单校验和序列化逻辑（如 form.val()、form.on('submit')）压根“看不见”这个变化。hidden 域必须被 layui 的 form 模块识别为“受控字段”，否则提交时会被忽略。

正确给 layui hidden 域赋值的两种方式

核心原则：所有赋值操作必须走 layui 的 form.val() API，且 hidden 元素需有合法的 name 属性，并被包含在 form 标签内。

深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载

• 方式一（推荐）：用 form.val() 批量赋值（支持 hidden）

  layui.use('form', function(){
    var form = layui.form;
    // 给 name="user_id" 的 hidden 赋值
    form.val('your-form-filter', {
      'user_id': '12345'
    });
  });

• 方式二：手动触发重渲染（仅当 hidden 是动态插入的）

  // 插入 hidden 后必须重新解析
  $('form').append('<input type="hidden" name="token" value="abc">');
  form.render('select'); // render 不支持 hidden，但调用它会触发内部字段扫描
  // 更稳妥：直接再调一次 form.val() 强制写入
  form.val('your-form-filter', {'token': 'abc'});
  

hidden 域必须满足的三个条件才能被提交

缺一不可，漏掉任意一个都会导致值为空或不提交：

• type="hidden" 且有 name 属性（如 <input type="hidden" name="status">）
• 该元素必须位于带有 lay-filter 的 <form></form> 标签内部
• 赋值必须通过 form.val('filter-name', {...})，不能用 $('[name="status"]').val('1') 或 elem.value = '1'

调试 hidden 是否生效的快速验证法

别猜，直接看提交前的数据：

• 在 submit 监听里打印：

  form.on('submit(your-filter)', function(data){
    console.log('提交数据:', data.field); // 这里必须包含你的 hidden 字段
    return false;
  });

• 如果 data.field 里没有 hidden 的 key，说明它没被 form 模块采集到——回头检查 name、位置、赋值方式
• 注意：浏览器开发者工具的 Network 中查看 Form Data，是最终实际发送的内容，比 JS 打印更真实

layui 的 hidden 不是“写进去就完事”，它依赖 form 模块对整个表单结构的初始化和状态维护。最常被忽略的是：动态添加的 hidden 必须补调 form.val()，而不是只塞 DOM。