Issue
so i have a servlet hosted which is connected to postgres database the thing is i need to create a login page which should send data to the servlet which is hosted in tomcat and also the servlet will have a set of ids and price that should be returned back to ember for displaying how can i do that?
the servlet code example (have added only the neccessary parts so ignore errors in servlet)
import java.io.IOException;
import java.io.PrintWriter;
import javax.security.auth.login.Configuration;
import java.util.HashMap;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.security.auth.login.AppConfigurationEntry;
import javax.security.auth.login.LoginContext;
import javax.sql.rowset.serial.SerialException;
public class AuthenticationServlet extends HttpServlet{
public static LoginContext loginContext = null;
protected void doGet(HttpServletRequest request,HttpServletResponse response)throws ServletException, IOException{
String name = null;
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("<html><body>");
String user = request.getParameter("uname");
String mobile = request.getParameter("mobile");
System.out.println("user -> "+user + "mobile "+ mobile);
}
the servlet code which prints the data from postgres which must be modified so that the ember should print it
ResultSet rs = null;
try {
System.out.println("[+]inside showrooms..");
String query = String.format(
"SELECT room.id,capacity,rtype,price FROM room JOIN capacity ON room.cid=capacity.id JOIN rtype ON room.tid = rtype.id WHERE isavailablle = true;");
stmt = con.createStatement();
rs = stmt.executeQuery(query);
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("<head>");
out.println("<body>");
out.println("<table>");
out.println("<tr>");
out.println("<td><b>roomno</b></td>");
out.println("<td><b>capacity</b></td>");
out.print("<td><b>roomtype</b></td>");
out.println("<td><b>price</b></td>");
while (rs.next()) {
out.println("<tr>");
out.print("<td>" + rs.getString("id") + "</td>");
out.print("<td>" + rs.getString("capacity") + "</td>");
out.print("<td>" + rs.getString("rtype") + "</td>");
out.println("<td>" + rs.getString("price") + "</td>");
out.println("</tr>");
}
out.println("<form method='post' action=\"My\">");
out.println("<table>");
out.println("<tr>");
out.println("<td><h2>Select a room number</td></h2></tr>");
out.println("<tr><td><input type = 'text' name = 'roomno'></td></tr>");
out.println("<tr><td><h4>Enter the start date(YYYY-mm-dd)</h4></td></tr>");
out.println("<tr><td><input type=\"date\" placeholder=\"yyyy-mm-dd\" id=\"sdate\" name=\"sdate\"\r\n"
+ " value=\"2022-07-01\"\r\n"
+ " min=\"2022-07-01\" max=\"2022-07-31\"></td></tr>");
out.println("<tr><td><h4>Enter the end date(YYYY-mm-dd)</h4></td></tr>");
out.println("<tr><td><input type=\"date\" placeholder = \"yyyy-mm-dd\" id = \"edate\" name = \"edate\""
+ " value=\"2022-07-01\"\r\n"
+ "min= \"2022-07-01\" max =\"2022-07-31\"></td></tr>");
out.println("<tr><td><input type = 'submit' value = 'reserve'>");
out.println("</table></body></html>");
} catch (Exception e) {
System.out.println(e);
}
}
Solution
So after working out and getting a hold on ember and servlet it seems that there are multiple ways to send and receive data between ember and servlet like a traditional http request using ajax.
Sending a http request can be done via a controller from ember importing ajax a sample http request can be like
import Controller from '@ember/controller';
import { action } from '@ember/object';
export default class IndexController extends Controller {
@action
get() {
var dis = this;
var uname = document.getElementById('uname').value;
var pass = document.getElementById('pass').value;
console.log('name ->' + name + 'pass -> ' + pass);
$.ajax({
url: 'http://localhost:8080/auth/Login',
data: {
uname: uname,
pass: pass,
},
method: 'GET',
success: function (response) {
if (response == 0) {
alert("welcome");
dis.transitionToRoute('app');
}else if(response == 1){
alert("Password needed to be changed");
dis.transitionToRoute('resetpwd');
}
},
error: () => {
alert('error');
},
});
}
}
dependencies: ember-ajax https://www.npmjs.com/package/ember-ajax
so this ajax request here sends a request with uname and password as parameter and act accordingly with the response. if you want to recieve data files like a json object from servlet or any other back end you can also do that. you can refer the following answer by @NullVoxPopuli which answers the same.
couldnt render a json array from servlet in ember js
but the good method is to use ember data which follows a series of action including
- creating a model for the json data
- creating an adapter for the request
- creating a serializer for serializing the incoming data
- importing the model in your router.
you can have a detailed view of this in the following youtube video
and if you want me to explain more with regard to your code comment it
Answered By - hariharan baskaran
Answer Checked By - Clifford M. (JavaFixing Volunteer)