Para la páginación de la página tengo una función donde le digo el inicio y el fin de los registros a mostrar, los carga en un vector y los muestra. (lo hago con Limit inicio,fin). Mi problema es que no se como hacer para que al pulsar el número de página se llame otra vez a la funcion que os comente antes y se cargen los nuevos registros sin recargar la página. Se que tendría que hacerlo con ajax pero no se como hacerlo, os voy a pegar el código para que veais lo que os cuento:
Código:
<%
HttpSession sesion = request.getSession();
boolean vacio=true;
boolean noresultados=false;
Vector<oferta> v=new Vector();
oferta of=new oferta();
int numOfertas=0;
numOfertas=of.ObtenerNumOfertas();
int cantidadOfertas=5;
int numPag=0;
int inicio=0, iniciosig=0;
int fin=cantidadOfertas;
numPag=numOfertas/cantidadOfertas;
if(numOfertas%cantidadOfertas!=0)
numPag=numPag+1;
v=of.CargarOfertas(inicio,fin); //cargamos la primera página
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="estilos/hoja2.css" />
<script language="JavaScript" type="text/JavaScript" src="js/funciones.js"></script>
<title>JSP Page</title>
</head>
<body>
<form id="formInicial" name="formInicial" method="post" action="ServletBusqueda">
<input type="hidden" id="origen" name="origen" value="inicio">
<div id="contenido">
<div id="cabecera">
<div class="logo"></div>
</div>
<div class="clear"></div>
<div id="AreaTrabajo" class="posR">
<div id="cuerpo">
<div class="margen">
<%if(!v.isEmpty()) { %>
<table class="Listado" id="tablaOfertas3" width="100%" cellspacing="0" cellpadding="0" border="0" >
<thead>
<tr>
<th>
<div class="" onclick="">
<div class="txt"><label>Fecha </label></div>
<div class="flechaOrden"><a href=""><img src="imagenes/ordenar.png"/></a></div>
</div>
</th>
<th>
<div class="">
<div class="txt"><label>Empresa </label></div>
<div class="flechaOrden"><img src="imagenes/ordenar.png"/></div>
</div>
</th>
<th>
<div class="">
<div class="txt"><label>Puesto </label></div>
<div class="flechaOrden"><img src="imagenes/ordenar.png"/></div>
</div>
</th>
<th>
<div >
<div class="txt"><label>Provincia </label></div>
<div class="flechaOrden"><img src="imagenes/ordenar.png"/></div>
</div>
</th>
<th>
<div class="">
<div class="txt"><label>Categoria </label></div>
<div class="flechaOrden"><img src="imagenes/ordenar.png"/></div>
</div>
</th>
<th>Consultar</th>
</tr>
</thead>
<tbody >
<% for(int i=0; i<v.size(); i++) {
of=v.get(i); %>
<% if(i%2==0){ %>
<tr class="gris">
<% }else{ %>
<tr class="normal">
<% }%>
<td><%=of.GetFecha()%></td>
<td><%=of.GetEmpresa() %></td>
<td><%=of.GetPuesto() %></td>
<td><%=of.GetProvincia() %></td>
<td><%=of.GetCategoria() %></td>
<td align="center">
<a href="javascript:pasarVariables('ConsultarOferta.jsp',<%=of.GetId()%>)"><img src="imagenes/consultar.gif" /></a>
</td>
</tr>
<% } %>
</tbody>
</table>
<div class="clear"></div>
<div class="espacio5"></div>
<div class="numeracion">
<% for(int i=1; i<=numPag; i++) { %>
<a class="verdeClaro separadorIzq5" onclick="javascript:CalcularIndices('<%=i%>','<%=cantidadOfertas%>');" href="#" ><%=i%></a>
<input type="hidden" name="inicio" id="inicio" />
<input type="hidden" name="fin" id="fin" />
<% } %>
<% if (numPag>1) { %>
<a class="verdeClaro separadorIzq5 " href=""> Siguiente » </a>
<% } %>
</div>
<div class="espacio25"></div>
<% } else { %>
<div class="margen">
<label class="label4">En estos momentos no disponemos de ningún oferta para mostrarle. </label>
</div>
<% } %>
</div>
</div>
<div class="clear"></div>
</div>
<div id="pie"></div>
<div class="clear"></div>
</div>
</form>
</body>
</html>
las tres partes en rojo corresponden:
1º función para cargar los registros adecuados
2º donde los muestro
3º números de la páginación (aqui pondre el onclick para que cuando haga click carge los registros correspondiente, pero como los muestro, sin recargar la página?
espero que me entiendan y me ayuden porque no tengo ni idea de como hacerlo.
