Calling Servlet doPost method when clicking a Div in a JSP

Question

I have been searching for a while, and I can't find any information related with the following problem...

I have a JSP file in which by cicking in a div, I want to call a Servlet's doPost method. The div is used as a button. I'll stick an image so that you can understand better what I am trying.

http://s29.postimg.org/95d9an5sn/Sin_t_tulo_2.png

The div has a hover css code that makes it blue, and each of those cells is a different div. What I want is that by clicking each of those cells, a Servlet doPost method get called.

Thank you very much.

edit:

plans.jsp:

<%@page import="controller.wizard.classes.Plan"%>
<%@page import="java.util.ArrayList"%>
<%@page import="controller.Configuracion"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>

<!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=ISO-8859-1">
    <link rel="stylesheet" href="<%=Configuracion.getInstance().getRoot()%>css/style.css" type="text/css">
    <script type="text/javascript" src="<%=Configuracion.getInstance().getRoot()%>js/jquery-1.11.1.js"></script>
    <script type="text/javascript" src="<%=Configuracion.getInstance().getRoot()%>js/ajax.js"></script>
    <title>Welcome</title>
    <script>
        function transferCallToServlet()
        {
            document.requestForm.action = "/cargar_plan";
            document.requestForm.submit();
        }
    </script>
</head>
<body>

    <jsp:include page="/common/header.jsp" />
    <jsp:include page="/common/userHeader.jsp" />
    <div class="marginNavbarUser"></div>
    <div class = "contentWrapper white">
        <div id="body">

            <h1>PLANES DE ORDENACIÓN INDUSTRIAL PARCIAL</h1>
            <% ArrayList<Plan> planes = (ArrayList<Plan>)request.getSession().getAttribute("planes"); 

            for(int i = 0; i < planes.size(); i++){%>
                <form name="requestForm" method="POST">
                    <div class="planWrapper" onclick="transferCallToServlet()">
                        <h2><%=planes.get(i).getDenominacion().toUpperCase() %></h2>
                        <p><%=planes.get(i).getNombre_sector() %> (#<%=planes.get(i).getNumero_sector() %>)</p>
                        <table>
                          <tr>
                            <td><p><%=planes.get(i).getMunicipio() %></p></td>
                          </tr>
                          <tr>
                            <td><p>Fase #<%=planes.get(i).getFase() %></p></td>
                            <td><p>Creación: <%=planes.get(i).getFechaCreacion() %></p></td>
                          </tr>
                          <tr>
                            <td><p><%=planes.get(i).getIdioma() %></p></td>
                            <td><p>Última modificación: <%=planes.get(i).getFechaUltimaModificacion() %></p></td>
                          </tr>
                        </table>
                    </div>
                </form>
            <%}%>





        </div>
    </div>
    <jsp:include page="/common/footer.jsp" />

</body>

CargarPlan.java

package controller.plan;

import java.io.IOException;
import java.sql.SQLException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import controller.errores.SQLError;
import controller.wizard.classes.Plan;
import model.Dao;

/**
 * Servlet implementation class CargarPlan
 */
@WebServlet("/cargar_plan")
public class CargarPlan extends HttpServlet {
private static final long serialVersionUID = 1L;

/**
 * @see HttpServlet#HttpServlet()
 */
public CargarPlan() {
    super();
    // TODO Auto-generated constructor stub
}

/**
 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
 */
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    try {


        HttpSession sesion = request.getSession();

        int id = Integer.parseInt(request.getParameter("id"));

        Dao dao = new Dao();

        Plan plan = dao.getWizard().getPlan(id);

        sesion.setAttribute("plan", plan);

        request.getRequestDispatcher("/user_area/plan.jsp").forward(request, response);

        System.out.println(id);

    } catch (SQLException e) {
        SQLError error = new SQLError(request, response, e);
    }


}

}

Provide a snippet of your jsp code? – GUISSOUMA Issam Sep 29 '15 at 10:15 — GUISSOUMA Issam, Sep 29 '15 at 10:15

RockAndRoll · Accepted Answer · 2015-09-30T06:33:48.847

2

You can do it with a little bit help of javascript. First you need to write a javascript function that will redirect your request to the servlet by submitting the form. See this exmaple
test.jsp

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script>
function transferCallToServlet(i)
{
document.requestForm.action = "myServlet";
document.requestForm.download.value=i;
document.requestForm.submit();

}
</script>
</head>
<body>
<form name="requestForm" method="get">
<input type="hidden" name="download" >
<% for(int i=0;i<6;i++){ %>
<div style="background-color: black;width=10px;height: 100px" onclick="transferCallToServlet(<%=i %>)" >
</div>
<br>
<%} %>

</form>
</body>
</html>

myServlet.java

....
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("Hii In the servlet");
    }

When you will click on that div,it will call doPost method of the servlet(myServlet in this example)".

Note to Remember - if you want that attribute in url,u need to change method from post to get so after submitting the form,in url you would be able to see that.Or else you keep it post,you can access it at server using request.getParameter("download").

edited Sep 30 '15 at 06:33

answered Sep 29 '15 at 11:23

RockAndRoll

2,247
2
16
35

This is not working, the transferCallToServlet() is detected, but then nothing happens. The servlet is not called :( – mikizas Sep 29 '15 at 16:24
i tested it..it worked fine..may be your servlet is not properly mapped.Could you pl share code how did you map it? – RockAndRoll Sep 29 '15 at 16:59
Yes I am mapping it in the same Servlet. Just hold a sec and I'll upload it. – mikizas Sep 29 '15 at 17:00
I have edited the question, and added the servlet and jsp. – mikizas Sep 29 '15 at 17:13
You need to put the form outside of for loop.put it outside of for loop and try. – RockAndRoll Sep 29 '15 at 17:23
remove / from 'document.requestForm.action = "/cargar_plan";' – RockAndRoll Sep 29 '15 at 17:24
Okey, it seems to work now, but how could I pass the id of the element that I am changing in the loop? planes.get(i).getIdPlan(); Thanks! – mikizas Sep 29 '15 at 17:39
you can add a hidden input in your form and you can set that in transferCallToServlet.You will have to pass i in transferCallToServlet as an argument which you will use to set that hidden field. – RockAndRoll Sep 29 '15 at 17:43
I don't get it : ( what type of input should I use? should it be inside the loop? And how could I send that to the Servlet? Can you provide some code please? I would be really gratefull! Thanks – mikizas Sep 29 '15 at 17:51
I will refine my shared example to match your needs by tomorrow.Its kind of late today. – RockAndRoll Sep 29 '15 at 17:54
Edited the code to pass argument while calling javascript.I hope it helps. – RockAndRoll Sep 30 '15 at 06:26

Calling Servlet doPost method when clicking a Div in a JSP

1 Answers1