热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

layui对弹窗form表单赋值的实现方法

今天小编就为大家分享一篇layui对弹窗form表单赋值的实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

目的: 点击编辑按钮 实现 数据回显到弹出 子页面 表单 内。如下图:

Html 代码:


 
其它省略...

Js 代码:

layer.open({
    type: 2
    ,title: '编辑用户'
    ,content: 'xx.html'
    ,maxmin: true
    ,area: ['500px', '450px']
    ,btn: ['确定', '取消']
    ,yes: function(index, layero){
     
    省略...
    }
    ,success: function(layero, index){
   
      // 方式一 其实就是获取的 子页面的 div  
      var div = layero.find('iframe').contents().find('#useradmin'); // div.html() div里面的内容,不包含当前这个div
        
       // 方式二 
       var body = layer.getChildFrame('body', index); // body.html() body里面的内容 
   
       
       /* ---- 附加内容 看看就好 Begin ---- */
      var iframeWindow = window['layui-layer-iframe'+ index]  // 方式一: 得到iframe页的窗口对象
      var iframeWindow = window[layero.find('iframe')[0]['name']];  // 方式二: 得到iframe页的窗口对象
      /* ---- 附加内容 看看就好 End ---- */
 
      // 测试 :
      body.find("#username").val("admin"); // 方式一
   
      div.find("#username").val("admin"); // 方式二 
    }
 });

layui 表单数据获取 : 可参考layui 实例 : https://www.layui.com/demo/table/operate.html 。

这里建议 form表单 属性名 和 表格的属性名 最好一致, 获取的数据 遍历赋值时,只需一遍操作,避免当表单数据过多时,需要写多个 div.find("# id").val(" ");

以上这篇layui 对弹窗 form表单赋值的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。


推荐阅读
  • 本文详细介绍了如何使用Maven高效管理多模块项目,涵盖项目结构设计、依赖管理和构建优化等方面。通过具体的实例和配置说明,帮助开发者更好地理解和应用Maven在复杂项目中的优势。 ... [详细]
  • 深入理解Cookie与Session会话管理
    本文详细介绍了如何通过HTTP响应和请求处理浏览器的Cookie信息,以及如何创建、设置和管理Cookie。同时探讨了会话跟踪技术中的Session机制,解释其原理及应用场景。 ... [详细]
  • 本文详细介绍了如何使用Python编写爬虫程序,从豆瓣电影Top250页面抓取电影信息。文章涵盖了从基础的网页请求到处理反爬虫机制,再到多页数据抓取的全过程,并提供了完整的代码示例。 ... [详细]
  • 本文深入探讨 MyBatis 中动态 SQL 的使用方法,包括 if/where、trim 自定义字符串截取规则、choose 分支选择、封装查询和修改条件的 where/set 标签、批量处理的 foreach 标签以及内置参数和 bind 的用法。 ... [详细]
  • 使用 Azure Service Principal 和 Microsoft Graph API 获取 AAD 用户列表
    本文介绍了一段通用代码示例,该代码不仅能够操作 Azure Active Directory (AAD),还可以通过 Azure Service Principal 的授权访问和管理 Azure 订阅资源。Azure 的架构可以分为两个层级:AAD 和 Subscription。 ... [详细]
  • 导航栏样式练习:项目实例解析
    本文详细介绍了如何创建一个具有动态效果的导航栏,包括HTML、CSS和JavaScript代码的实现,并附有详细的说明和效果图。 ... [详细]
  • CentOS7源码编译安装MySQL5.6
    2019独角兽企业重金招聘Python工程师标准一、先在cmake官网下个最新的cmake源码包cmake官网:https:www.cmake.org如此时最新 ... [详细]
  • 本文详细介绍了 Dockerfile 的编写方法及其在网络配置中的应用,涵盖基础指令、镜像构建与发布流程,并深入探讨了 Docker 的默认网络、容器互联及自定义网络的实现。 ... [详细]
  • 深入理解Java中的volatile、内存屏障与CPU指令
    本文详细探讨了Java中volatile关键字的作用机制,以及其与内存屏障和CPU指令之间的关系。通过具体示例和专业解析,帮助读者更好地理解多线程编程中的同步问题。 ... [详细]
  • 如何在PHPcms网站中添加广告
    本文详细介绍了在PHPcms网站后台添加广告的方法,涵盖多种常见的广告形式,如百度广告和Google广告,并提供了相关设置的步骤。同时,文章还探讨了优化网站流量的SEO策略。 ... [详细]
  • 介绍一个提供正版Windows软件下载的权威网站,确保用户能够安全合法地获取所需软件。 ... [详细]
  • 解决Linux系统中pygraphviz安装问题
    本文探讨了在Linux环境下安装pygraphviz时遇到的常见问题,并提供了详细的解决方案和最佳实践。 ... [详细]
  • 数据库内核开发入门 | 搭建研发环境的初步指南
    本课程将带你从零开始,逐步掌握数据库内核开发的基础知识和实践技能,重点介绍如何搭建OceanBase的开发环境。 ... [详细]
  • 本文介绍如何使用 Python 编写程序,检查给定列表中的元素是否形成交替峰值模式。我们将探讨两种不同的方法来实现这一目标,并提供详细的代码示例。 ... [详细]
  • Yii 实现阿里云短信发送 ... [详细]
author-avatar
夏未夏至青_872
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有