Issue
I am sending form data using Jsp through AJAX on Servlet.
reg.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<form>
Enter name:<input type="text" id="name" /> <br />
<button onclick="callJqueryAjax()">Save</button>
</form>
<span id="result"></span>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
function callJqueryAjax() {
location.reload(false);
var name = $('#name').val();
console.log(name);
$.ajax({
url : 'Save',
method : 'POST',
data : {
name : name,
},
success : function(resultText) {
$("#result").html(resultText);
}
});
}
</script>
</body>
</html>
SaveMe.java
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.SQLException;
import java.sql.Statement;
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
@WebServlet("/Save")
public class SaveMe extends HttpServlet {
private static final long serialVersionUID = 1L;
private Connection makeCon;
private Statement stmt;
public void init(ServletConfig config) throws ServletException {
JdbcCon jdbcCon = new JdbcCon();
makeCon = jdbcCon.makeCon();
try {
stmt = makeCon.createStatement();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
protected void doPost(HttpServletRequest request, HttpServletResponse res) throws ServletException, IOException {
String name = request.getParameter("name");
res.setContentType("text/html");
PrintWriter out = res.getWriter();
String sql = "insert into users (name) Values('" + name + "')";
System.out.println(sql);
try {
int result = stmt.executeUpdate(sql);
if (result > 0) {
out.print("Inserted");
} else
out.print("Not Inserted");
} catch (SQLException e) {
}
}
}
I receive the output in ajax but the thing is JSP gets reload by itself and removes the response as well as removes the data from Textbox from which my response gets disappear by itself.
Please provide me the solution and also a better way for writing an ajax call
Solution
First of all I didn't understand why you are using "location.reload(false);" in your JSP page before submitting the ajax request. You could remove it. In addition a good practice when using ajax request is to specify the "dataType", in your case "html". Here is an example:
$.ajax( {
type : 'POST',
url : 'SaveMe',
success : function(result) {
$("#result").html(result);
},
dataType : "html"
});
Answered By - Emile ASTIH
Answer Checked By - Robin (JavaFixing Admin)
