estoy intentando cerrar modal al eliminar un registro, esto me funciona correctamente, pero después eliminar, a ir a otro registro para eliminar, no me levanta el modal de eliminar. Estoy usando jsp y servlet, y tengo unas validaciones en el servlet usando jquery,y en el servlet es donde está el botón que abre el modal por bootstrap y para poder habrir el modal despues de cerrarlo con hide(), hice una funcion jquery en el servlet para abrir el modal nuevamente al presionar dicho botón. El problema es que aun así el modal se abre y se cierra altiro.
Aquí el código de jquert
function eliminarTramosReservasAjax()
{
var numTramoReservaAjax = $("#txtIdTramosReservaAjax").val();
$.ajax({
url: "eliminarTramoReservaVueloAjaxServlet.do",
data: {
numTramoReservaJS : numTramoReservaAjax
},
success: function( result ) {
$( "#idResultadoEliminarTramoReserva").html( result);
mostrarRutaReservaPorAjax();
$("#modalTramoReservaEliminar").modal("hide");
//$("body").removeClass("modal-open");
//$(".modal-backdrop").remove();
}
}
);
acá el servlet que al final tiene las funciones de jquery
protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
Reserva rv =new Reserva();
Cliente c=new Cliente();
TramoReservaDao trDao=new TramoReservaDao();
Connection conn = ConexionMysqlCargomove_db.getInstance().getConnection();
rv.setNumeroReserva(Integer.parseInt(request.getParameter("numeroReservaAjax")));
ResultSet res=(ResultSet)trDao.verTramoReservas(rv);
ArrayList<TramoReserva> rutaReserva = new ArrayList<TramoReserva>();
ArrayList<Reserva> verReserva = new ArrayList<Reserva>();
ArrayList<LineaAerea> lineaReserva = new ArrayList<LineaAerea>();
if(res==null)
{
String error="No se encontraron datos";
request.getSession().setAttribute("error", error);
request.getRequestDispatcher("errorVerReservas.jsp").forward(request, response);
}
else
{
try
{
while(res.next())
{
rutaReserva.add(new TramoReserva(res.getInt("COD_SEQ_TVAS"),res.getString("ORI_TVAS"),res.getString("DES_TVAS"),res.getString("FECH_VLO_TVAS"),res.getString("FECH_SALIDA_TVAS"),res.getString("FECH_LLEGADA_TVAS"),res.getString("EST_TVAS"),res.getInt("PIEZAS_TVAS"),res.getDouble("KILOS_TVAS"),res.getDouble("VOLUMEN_TVAS"),res.getString("NOTAS_TVAS"),res.getDouble("TARIFA_TVAS"),res.getString("TPO_MONEDA_TVAS"),res.getInt("NUM_VLO_TVAS")));
verReserva.add(new Reserva(res.getInt("RVAS_COD_SEQ_RVAS")));
lineaReserva.add(new LineaAerea(res.getString("LNAR_COD_LNAR")));
}
request.getSession().setAttribute("rutaReserva", rutaReserva);
request.getSession().setAttribute("verReserva", verReserva);
request.getSession().setAttribute("lineaReserva", lineaReserva);
}
catch(SQLException ex)
{
java.util.logging.Logger.getLogger(VerTramoReservaServlet.class.getName()).log(Level.SEVERE, null, ex);
}
PrintWriter out = response.getWriter();
try {
out.println("<!DOCTYPE html>");
out.println("<html>");
out.println("<head>");
out.println("<title>Servlet VerRutaResevaClienteServlet</title>");
out.println("</head>");
out.println("<body>");
out.println("<table class='table table-condensed table-hover' id='tablaResultadoTramoReservas'>");
out.println("<thead class='input-sm'>");
out.println("<tr>");
out.println("<th style='display:none'>ID</th>");
out.println("<th>Origen</th>");
out.println("<th>Destino</th>");
out.println("<th style='display:none'>Fecha Vuelo</th>");
out.println("<th>F Salida</th>");
out.println("<th>F Llegada</th>");
out.println("<th>Estado</th>");
out.println("<th>Piezas</th>");
out.println("<th>Kilos</th>");
out.println("<th>Volumen</th>");
out.println("<th style='display:none'>Notas</th>");
out.println("<th>Tarifa</th>");
out.println("<th>Tipo Moneda</th>");
out.println("<th style='display:none'>Nº Reserva</th>");
out.println("<th>Linea Aerea</th>");
out.println("<th>Numero Vuelo</th>");
out.println("<th>Acción</th>");
out.println("</tr>");
out.println("</thead>");
for(int i=0;i<rutaReserva.size();i++)
{
out.println("<tbody class='input-sm'>");
out.println("<tr>");
out.println("<td style='display:none'>"+rutaReserva.get(i).getIdTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getOrigenTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getDestinoTramoReserva()+"</td>");
out.println("<td style='display:none'>"+rutaReserva.get(i).getFechaVueloTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getFechaSalidaTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getFechaSalidaTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getEstadoTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getPiezasTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getKilosTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getVolumenTramoReserva()+"</td>");
out.println("<td style='display:none'>"+rutaReserva.get(i).getNotasTramoReservas()+"</td>");
out.println("<td>"+rutaReserva.get(i).getTarifaTramoReserva()+"</td>");
out.println("<td>"+rutaReserva.get(i).getTpoMonedaTramoReserva()+"</td>");
}
for(int i=0;i<verReserva.size();i++)
{
out.println("<td style='display:none'>"+verReserva.get(i).getNumeroReserva()+"</td>");
}
for(int i=0;i<lineaReserva.size();i++)
{
out.println("<td>"+lineaReserva.get(i).getCodigoLineaAerea()+"</td>");
System.out.println("Linea aerea:"+lineaReserva.get(i).getCodigoLineaAerea());
}
for(int i=0;i<rutaReserva.size();i++)
{
out.println("<td>"+rutaReserva.get(i).getNumVueloTramoReserva()+"</td>");
out.println("<td><button type='button' class='btn btn-danger glyphicon glyphicon-trash btn-xs' data-toggle='modal' data-target='#modalTramoReservaEliminar' style='font-size:19px' onclick='abrirModal()'></button></td>");
}
}
catch(java.lang.NullPointerException ex)
{
out.println("<td><p>No se encontraron datos</p></td>");
out.println("</tr>");
out.println("</tbody>");
out.println("</table>");
}
out.println("<!------------------------INICIO FUNCION PARA ENVIAR EL ID DEL TRAMO DE LA RESERVA AL MODAL ELIMINAR TRAMOS RESERVA-------------->");
out.println("<script>");
out.println("$(document).ready(function () {");
out.println("$('#tablaResultadoTramoReservas tbody tr').on ('click',function (event) {");
out.println("var idTramoReservas= $(this).find('td:first-child').html();");
out.println("$('#txtIdTramosReservaAjax').val(idTramoReservas);");
out.println("});");
out.println("});");
out.println("</script>");
out.println("<!------------------------INICIO FUNCION PARA ENVIAR EL ID DEL TRAMO DE LA RESERVA AL MODAL ELIMINAR TRAMOS RESERVA-------------->");
/**FUNCTION ABRIR MODAL ELIMINAR**/
out.println("<script>");
out.println("function abrirModal()");
out.println("{");
out.println("$('#modalTramoReservaEliminar').modal('show');");
out.println("}");
out.println("</script>");
out.println("</body>");
out.println("</html>");
}
}
Aquí el codigo de la pagina jsp con el modal
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Air Express Admin</title>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
<script src="sweetalert2.all.min.js"></script>
</head>
<body>
<div id="modalTramoReservaEliminar" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header btn-danger">
<button type="button" class="close" data-dismiss="modal">×</button>
<h3 class="modal-title" style="color: white"><span class="glyphicon glyphicon-trash"></span> Eliminar</h3>
</div>
<div class="modal-body">
<div class="left container-fluid">
<div class="panel-heading"></div>
<div class="panel-body panel panel-warning">
<form method="POST">
<h4>Deseas quitar el tramo de tu reserva Nº:<input type="text" id="txtIdTramosReservaAjax" class="input-sm" size="1" name="txt_num_tramo_reserva" readonly="readonly" style="font-size:13pt; border:0;">?</h4>
<br>
</form>
<div class="container-fluid" id="idResultadoEliminarTramoReserva"></div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger btn-sm" onclick="eliminarTramosReservasAjax()"><span class="glyphicon glyphicon-trash"></span> Eliminar</button>
<button class="btn btn-default btn-sm" type="button" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Cerrar </button>
</div>
</div>
</div>
</div>
</body>
</html>