layer.open提交子页面的form和layedit文本编辑内容的方法

主要 用到layer 自带的取子页面dom的方法 layer.getChildFrame(),在父页面对子页面dom进行操作

js代码:在layer.open 中 btn yes function(index, layero){ }中 获取子页面的dom 进行操作:

		$("a[name='editNews']").click(function() {
			layer.open({
				type: 2,
				title: '编辑',
				shadeClose: true,
				shade: 0.8,
				area: ['99%', '99%'],
				offset: ['2px'],
				content: '/gcsoft/news/getNewsDetailById.action?itemId=' +
    $(this).attr("data-value"),
				btn: ['提交', '取消'],
				yes: function(index, layero) {

     //取子页面的form
					var newsFrom = layer.getChildFrame('#newsFrom', index);

     //取子页面的layeidt LAY_layedit_1
var layeditCt = layer.getChildFrame('#LAY_layedit_1',index).contents().find('body');

     //获取layedit中的html标签 并且赋值给子页面定义的Id为'content' textarea
					layer.getChildFrame('#content', index).val(layeditCt[0].innerHTML);

					if(newsFrom.find("#menuId").val() == '' ||
     newsFrom.find("#menuId").val() == -1 || newsFrom.find("#title").val()
     == '') {
						layer.msg('标题和栏目不能为空');
						return
					}

			  //ajax提交
					$.ajax({
						type: "POST",
						dataType: "json",
						url: "/gcsoft/news/addOrUpdateNews.action",
						data: newsFrom.serialize(),//newsForm序列化
						success: function(result) {
							layer.msg('保存成功!');
							layer.closeAll();
						},
						error: function() {
							alert("异常!");
						}
					});
				},
				btn2: function() {
					window.location.reload();
				}
			});
		});

HTML 代码: 可以忽略不看


	<div class="container-fluid">
		<div class="row-fluid">
				<div class="box">
				<nav aria-label="breadcrumb">
					 <ol class="breadcrumb">
					 <li class="breadcrumb-item"><a href="/gcsoft/news/listAllNews.action" rel="external nofollow" >信息列表</a></li>
					 <li class="breadcrumb-item active" aria-current="page">新增/修改信息</li>
					 </ol>
			 </nav>
				<div>
				<div class="container">
				<form id="newsFrom" class="form-horizontal input-prepend" method="post" >
				<div class="row">
				 <div class="col-sm-6">
				 <div class="input-group mb-4">
					 <div class="input-group-prepend">
					 <span class="input-group-text">新闻标题</span>
					 </div>
					 <input type="text" class="form-control" id="title" name="title" value="<#if news ??>${news.title}</#if>">
					</div>
				 </div>

				 <div class="col-sm-6">
					<div class="input-group mb-3">
					 <div class="input-group-prepend">
					 <span class="input-group-text">作者</span>
					 </div>
		    	<input type="text" class="form-control" id="wen" name="wen" value="<#if news ??>${news.wen}</#if>">
 						<span id="wen_span" class="help-inline"> </span>
					</div>
				 </div>
				 </div>
				<div class="row">
	 			 <div class="col-sm-4">
	 			 <div class="input-group mb-3">
				 <div class="input-group-prepend">
				 <label class="input-group-text" for="inputGroupSelect01">一级栏目</label>
				 </div>
				 <select class="custom-select" id="Select1" ><option value="-1">------------------ 空 ------------------ </option></select>  
				 </div>
	 			 </div>
				 <div class="col-sm-4">
				 <div class="input-group mb-3">
				 <div class="input-group-prepend">
				 <label class="input-group-text" for="inputGroupSelect01">二级栏目</label>
				 </div>
				 <select class="custom-select" id="Select2" ><option value="-1">------------------ 空 ------------------ </option></select>  
				 </div>
				 </div>
				 <div class="col-sm-4">
				 <div class="input-group mb-3">
				 <div class="input-group-prepend">
				 <label class="input-group-text" for="inputGroupSelect01">三级栏目</label>
				 </div>
				 <select class="custom-select" id="Select3"><option value="-1">------------------ 空 ------------------ </option></select>  
				 </div>
				 </div>
				 <input type="hidden" check-type="required" id="menuId" name="menuId" value="<#if news ??>${news.menuId}<#else>0</#if>">
				</div>
				<div class="row">
	 			 <div class="col-sm-6">
	 			 <div class="input-group mb-3">
				 <input type="text" class="form-control" name="imgUrl" id="imgUrl" value="<#if news ??>${news.imgUrl}</#if>" >
				 <div class="input-group-append">
				 <button class="btn btn-outline-secondary" type="button" id="imageUpload">上传图片</button>
				 <button class="btn btn-outline-secondary" type="button" id="imageDele" >删除图片</button>
				 </div>
				 </div>
	 			 </div>
				 <div class="col-sm-6">
	 			 <div class="input-group mb-3">
				 <input type="text" class="form-control" name="videoUrl" id="videoUrl" value="<#if news ??>${news.videoUrl}</#if>" >
				 <div class="input-group-append">
				 <button class="btn btn-outline-secondary" type="button" id="videoUpload">上传视频</button>
				 <button class="btn btn-outline-secondary" type="button" id="videoDele" >删除视频</button>
				 </div>
				 </div>
				 </div>
				</div>
				<div class="row">
				 <div class="col-sm-3">
	 			 <div class="input-group mb-4">
				 <div class="input-group-prepend">
				 <label class="input-group-text" for="inputGroupSelect01">部门</label>
				 </div>
				 <select class="custom-select" data-rel="chosen" id="origin" name="origin" value="<#if news ??>${news.itemFrom}</#if>">
						<#if dept ??>
	    			<#list dept as domainInfo>
		    			<#if news ??>
									<#if domainInfo.infoCode = news.origin>
			    				<option value="${domainInfo.infoCode}" selected="selected"> ${domainInfo.infoName} </option>
			    			<#else>
			    				<option value="${domainInfo.infoCode}"> ${domainInfo.infoName} </option>
			    			</#if>
			    		<#else>
			    			<option value="${domainInfo.infoCode}"> ${domainInfo.infoName} </option>
								</#if>
	    			</#list>
	    		</#if>
	    	</select>
				 </div>
	 			 </div>
				 <div class="col-sm-3">
					<div class="input-group mb-3">
					 <div class="input-group-prepend">
					 <span class="input-group-text">发表时间</span>
					 </div>
		    <input type="text" class="form-control datepicker" id="itemTime" name="itemTime" value="<#if news ??>${news.itemTime}</#if>">
 					 <span id="itemTime_span" class="help-inline"> </span>
					</div>
				 </div>	

				 <div class="col-sm-2">
					<div class="input-group mb-3">
					 <div class="input-group-prepend">
					 <span class="input-group-text" >排序</span>
					 </div>
					 <input type="text" class="form-control" id="orderBy" name="orderBy" value="<#if news ??>${news.orderBy}</#if>" οnkeyup="this.value=this.value.replace(/\D/g,'')"/>
					</div>
				 </div>

				</div>
				<div class="row">
				<div class="col-sm-12" style="margin-bottom: 20px">
				<textarea name="content" id="content" style="display: none;"><#if news ??>${news.content}</#if></textarea>
							<div id="xhePanel" style="top: 50px;left: 50px;">
							<div class="xheMenu">
								<a href="javascript:void('1')" rel="external nofollow" title="极小" v="1" role="option" aria-setsize="8" aria-posinset="1" tabindex="0"><span style="font-size:10px;">极小(10px)</span></a>
								<a href="javascript:void('2')" rel="external nofollow" title="特小" v="2" role="option" aria-setsize="8" aria-posinset="2" tabindex="0"><span style="font-size:12px;">特小(12px)</span></a>
								<a href="javascript:void('3')" rel="external nofollow" title="小" v="3" role="option" aria-setsize="8" aria-posinset="3" tabindex="0"><span style="font-size:14px;">小(14px)</span></a>
								<a href="javascript:void('4')" rel="external nofollow" title="默认" v="4" role="option" aria-setsize="8" aria-posinset="4" tabindex="0"><span style="font-size:16px;">默认(16px)</span></a>
								<a href="javascript:void('5')" rel="external nofollow" title="中" v="5" role="option" aria-setsize="8" aria-posinset="5" tabindex="0"><span style="font-size:18px;">中(18px)</span></a>
								<a href="javascript:void('6')" rel="external nofollow" title="大" v="6" role="option" aria-setsize="8" aria-posinset="6" tabindex="0"><span style="font-size:24px;">大(24px)</span></a>
								<a href="javascript:void('7')" rel="external nofollow" title="特大" v="7" role="option" aria-setsize="8" aria-posinset="7" tabindex="0"><span style="font-size:32px;">特大(32px)</span></a>
								<a href="javascript:void('8')" rel="external nofollow" title="极大" v="8" role="option" aria-setsize="8" aria-posinset="8" tabindex="0"><span style="font-size:48px;">极大(48px)</span></a>
							</div>
						</div>
				</div>
				</div>
				<input type="hidden" id="itemId" name="itemId" value="<#if news ??>${news.itemId}</#if>">

				</form>
				</div>
				</div>
				</div>
		</div>
	</div>

以上这篇layer.open提交子页面的form和layedit文本编辑内容的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • layer.open 子页面弹出层向父页面传输数据的例子

    子页面向父页面传数据,利用弹出页面点击确定时返回的参数,即yes:function(index,layero){}的layero. 关键就一句: var obj = $(layero).find("iframe")[0].contentWindow; obj可以调用子页面的方法,这样就可以通过子页面传递数据了. $('#addQuota').on('click',function(){ layer.open({ type : 2, title : "子页面", re

  • layui 富文本编辑器和textarea值的相互传递方法

    1.富文本编辑器传递值给textarea <div class="layui-form-item layui-form-text"> <label class="layui-form-label">资讯内容</label> <div class="layui-input-block"> <textarea name="content" id="demo"

  • layer.open提交子页面的form和layedit文本编辑内容的方法

    主要 用到layer 自带的取子页面dom的方法 layer.getChildFrame(),在父页面对子页面dom进行操作 js代码:在layer.open 中 btn yes function(index, layero){ }中 获取子页面的dom 进行操作: $("a[name='editNews']").click(function() { layer.open({ type: 2, title: '编辑', shadeClose: true, shade: 0.8, are

  • ASP.NET Core中Razor页面的Handlers处理方法详解

    简介 在前一篇文章中,我们讨论了Razor页面.今天我们来谈谈处理方法(Handlers). 我们知道可以将代码和模型放在 .cshtml 文件里面或与 .cshtml 匹配的 .cshtml.cs 文件中. Razor页面处理程序或处理方法将用户请求匹配到我们的方法:请求来自 **.cshtml **文件. Razor页面遵循特定的命名约定.从上一篇文章可以看出,.NET Core开发工具自动生成了很多处理方法,例如下面这些: OnGet OnPost OnGetAsync OnPostAsy

  • DVA框架统一处理所有页面的loading状态

    dva 有一个管理 effects 执行的 hook,并基于此封装了 dva-loading 插件.通过这个插件,我们可以不必一遍遍地写 showLoading 和 hideLoading,当发起请求时,插件会自动设置数据里的 loading 状态为 true 或 false .然后我们在渲染 components 时绑定并根据这个数据进行渲染. dva-loading的使用非常简单,在index.js中加入: // 2. Plugins app.use(createLoading()); 每个

  • 原生JS 购物车及购物页面的cookie使用方法

    直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>购物页面</title> <style> ul{list-style:none;padding:0;margin:0;} .goods li{display:inline-block;border:1px solid #ddd;pa

  • 使用vue-router设置每个页面的title方法

    基本环境配置: webpack + vue2.0 + vue-router +nodeJS 进入 router 文件夹底下的index.js文件 首先引入: import Vue from 'vue' import Router from 'vue-router' 然后在路由里面配置每个路由的地址: routes: [ { /* (首页)默认路由地址 */ path: '/', name: 'Entrance', component: Entrance, meta: { title: '首页入口

  • python抽取指定url页面的title方法

    今天简单使用了一下python的re模块和lxml模块,分别利用的它们提供的正则表达式和xpath来解析页面源码从中提取所需的title,xpath在完成这样的小任务上效率非常好,在这里之所以又使用了一下正则表达式是因为xpath在处理一些特殊的页面的时候会出现乱码的情况,当然这不是xpath的原因,而是页面本身编码,跟utf-8转码之间有冲突所致,这里看代码: # !/usr/bin/python #-*-coding:utf-8-*- ''' 功能:抽取指定url的页面内容中的title '

  • Android实现触发html页面的Button控件点击事件方式

    在android开发中,往往有时会加载html界面,同时需要与之html里面的控件进行交互.这里简单介绍一下如何在android中触发加载的html界面的Button控件. 1. 首先看Activity的代码: 首先我们要获取到当前的WebView控件,然后通过html的路径加载html界面,当前的html路径我是在本地的,然后设置 WebSettings webSettings = mWebView.getSettings(); 这一句代码.之后添加 webSettings.setJavaSc

  • vue利用vue meta info设置每个页面的title与meta信息

    title: vue 使用 vue-meta-info 设置每个页面的 title 和 meta 信息 #文章页面上的显示名称,一般是中文 date: 2019-11-20 16:30:16 #文章生成时间,一般不改,当然也可以任意修改 categories: vue #分类 tags: [vue] #文章标签,可空,多标签请用格式,注意:后面有个空格 description: vue 使用 vue-meta-info 设置每个页面的 title 和 meta 信息 如需使用 vue-meta-

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

    目的: 点击编辑按钮 实现 数据回显到弹出 子页面 表单 内.如下图: Html 代码: <body> <div class="layui-form" lay-filter="useradmin" id="useradmin"> <div class="layui-form-item"> <label class="layui-form-label">用  户

  • layer.open的自适应及居中及子页面标题的修改方法

    layer.open的自适应: var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 parent.layer.iframeAuto(index); layer.open居中: var index1 = layer.load(2, { shade: false });//过渡 //重新定义layer.open的宽 var index = parent.layer.getFrameIndex(window.na

随机推荐