About the problem that the kindeditor submission can't get the obtained value

Today, we need to use a rich text editor to make a function. Before that, our colleagues had already configured the plug-in. That's great. Take it directly.

    At this time, strange things happened. All the things that my colleagues used were normal, but I couldn't get the value. If you can't think about it, Du Niang will solve it. It was found that my colleague submitted the form directly, while I submitted it with JS. The difference is here.
    The solution to the problem is very simple. Before js submits the form, add a sentence: document.getElementById("content1").value=KE.util.getData('content1 ');

//Get the value of content7 first
var content7 = document.getElementById("content7").value=KE.util.getData('content7');
//Assign this content7 to input
$("#content").val(content7);
//When submitting, the value is sent to the background through input
<input id="content" name="notice.content" type="hidden" value=""/>
$("#pagerForm").submit();

Here is an example of jsp I wrote

Note: with the kindeditor, when you wrap the content or change the font color, the kindeditor will automatically convert to the corresponding style

js of kindeditor
Link: https://pan.baidu.com/s/1kWv3js7 password: syhj

<%@page contentType="text/html; charset=utf-8"%>
<%@page session="false"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ page isELIgnored="false" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    String isvali=(String)request.getSession().getAttribute("isvali");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="<%=path %>/web/css/style.css" rel="stylesheet" type="text/css" />
<link href="<%=path %>/web/css/select.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="<%=path%>/web/mobile/css/lCalendar.css"/>
<script type="text/javascript" src="<%=path %>/web/js/jquery.js"></script>
<script type="text/javascript" src="<%=path %>/web/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="<%=path %>/web/js/My97DatePicker/calendar.js"></script>
<script type="text/javascript" charset="utf-8" src="<%=path %>/web/editor/kindeditor.js"></script>



<script type="text/javascript">
	KE.show({
        id : 'content7',
        cssPath : './index.css'
    });
	function ifSubmit(){
		var code = $("#name").val().trim();
		var name = $("#d423").val().trim();
		var content7 = document.getElementById("content7").value=KE.util.getData('content7');
		if(code==undefined || name==undefined || code==null || name==null || code=="" || name=="" || content7==null || content7==undefined || content7==""){
			return alert("Information cannot be empty!");
		}
		$("#content").val(content7);
		$("#pagerForm").submit();
	}
</script>
</head>

<body>

	<div class="place">  
    <span>Location:</span>
    <ul class="placeul">
    <li><a href="#"> Home Page</a></li>
    <li><a href="#"> front end management</a></li>
    </ul>
    </div>
    
  <form id="pagerForm"  action="<%=path%>/notice!insertNotice.do?" method="post" >   
  
    <div class="formbody">
    
    <div class="formtitle"><span>Announcement add</span></div>
	
		<input type="hidden" id="sid" name="sid" value="${sid}"/>    
			
    <ul class="forminfo">
	    <li><label>Announcement name</label><input id="name" name="notice.name" type="text" style="width:700px;" class="dfinput" value=""/></li>
	    <li>
	    	<label>Start time</label>
	    	<input id="d423" name="notice.date" class="dfinput" value="" class="Wdate" type="text" style="width:700px;" readonly="readonly" onfocus="WdatePicker({el:'d423',dateFmt:'yyyy-MM-dd HH:mm:ss'})"/>
	    </li>
	    <li>
	    	<label>Announcement content</label>
	    	<input id="content" name="notice.content" type="hidden" value=""/>	    	
	    	<textarea  id="content7" class="dfinput" style="width:700px;height:500px;visibility:hidden;"></textarea>
	    </li>
    </ul>

    
    </div>
    
    <div style="position: relative;width: 300px;height: 50px;margin-top;50px;margin-left: 60px;">
    	<div style="position: absolute;margin-left: 180px;"><input onclick="ifSubmit()" type="button" class="btn" value="Confirm save"/></div>
    	<div style="position: absolute;margin-left: 380px;"><input onclick="window.history.back(-1); " type="button" class="btn" value="Return" /></div>
    </div>

</form>
</body>

</html>

Tags: Javascript KindEditor JSP Session

Posted on Fri, 01 May 2020 09:34:45 -0700 by bingo333