Caríssimos,
Estou començando no mundo JQuery e já tive algumas amostras do quão poderoso é, no entanto estou com problemas para colocar uma paginação usando o PAGER do plugin TABLESORTER. A página é mostrada normalmente e consigo ordenar pelas colunas normalmente. A apresentação do resultado da pesquisa tb funciona, onde setei para mostrar 10 registros por vez. O problema é que ao clicar na navegação nada acontece. Deem uma olha no fonte da minha página que fiz usando Struts 2:
<%--
Document : header
Created on : Feb 19, 2009, 10:04:38 AM
Author : Alisson
--%>
<%--
<%@page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
--%>
<%@page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html">
<title>SNIPER</title>
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/jquery/tablesorter/docs/css/jq.css" type="text/css" media="print, projection, screen" />
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/jquery/tablesorter/themes/blue/style.css" type="text/css" media="print, projection, screen" />
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/estilo.css"/>
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/posicao.css"/>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/jquery-latest.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/jquery.tablesorter.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/addons/pager/jquery.tablesorter.pager.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/docs/js/chili/chili-1.8b.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/docs/js/docs.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/scripts/default.js"></script>
<script type="text/javascript">
$(function() {
$("table")
.tablesorter({widthFixed: true, widgets: ['zebra']})
.tablesorterPager({container: $("#pager")});
});
</script>
</head>
<body>
<div id="conteudo_geral">
<div id="topo">
<div id="topo_logo_esq">MPA</div>
<div id="topo_logo_dir"><img src="<%=request.getContextPath()%>/images/logo-stf.jpg" /></div>
</div>
<div class="menu">
<ul>
<li class="selecionado"><a href="<%= request.getContextPath() %>/estabelecimento/menuestabelecimento.action" title="Cadastro Base">Cadastro</a></li>
<li><a href="#" title="Movimentação">Movimentação</a></li>
<li><a href="#" title="Relatórios">Relatórios</a></li>
</ul>
</div>
<div>
<s:if test="hasActionErrors()">
<s:iterator value="actionErrors">
<span class="displayError" style="text-align:left;" ><s:property escape="false" /></span>
</s:iterator>
</s:if>
<s:if test="hasActionMessages()">
<s:iterator value="actionMessages">
<span class="displayInformation"><s:property escape="false" /></span>
</s:iterator>
</s:if>
</div>
<div id="conteudo">
<s:form id="formPesquisar" theme="simple" class="formulario">
<div id="pagina">
<b class="linha_1"></b><b class="linha_topo_1"></b><b class="linha_topo_2"></b><b class="linha_topo_3"></b>
<div class="quadro_titulo">
<h1>Filtros da Pesquisa</h1>
</div>
<div class="quadro_conteudo" >
<br/>
<table>
<tr>
<td><p class="formulario">Nome</p></td>
<td><p class="formulario">Nome fantasia</p></td>
</tr>
<tr>
<td>
<p class="formulario" style="width:500px" >
<s:textfield id="iptNomeSearch"
name="entitySearch.nome"
value='%{entitySearch.nome}'
theme="simple"
cssClass="formulario"/>
</p>
</td>
<td>
<p class="formulario" style="width:500px" >
<s:textfield id="iptNomeFantasiaSearch"
name="entitySearch.nomeFantasia"
value='%{entitySearch.nomeFantasia}'
theme="simple"
cssClass="formulario"/>
</p>
</td>
</tr>
</table>
<div class="submenu">
<ul>
<li><s:submit value="Pesquisar" action="pesquisar" theme="simple" /></li>
<li><s:submit value="Novo" action="incluirnovo" theme="simple" /></li>
<li><s:submit value="Excluir" onclick="return confirmacao('Deseja excluir os registros?');"
action="excluir" theme="simple" /> </li>
</ul>
</div>
</div>
<b class="linha_baixo_3"></b><b class="linha_baixo_2"></b><b class="linha_baixo_1"></b><b class="linha_1"></b>
</div>
<div id="pagina">
<b class="linha_1"></b><b class="linha_topo_1"></b><b class="linha_topo_2"></b><b class="linha_topo_3"></b>
<div class="quadro_titulo">
<h1>Resultado da Pesquisa</h1>
</div>
<div class="quadro_conteudo" >
<table summary="Resultado da Pesquisa" class="tablesorter">
<thead>
<tr>
<th style="text-align:center;"><input id="checkAll" type="checkbox" title="Marca/Desmarcar todos" /></th>
<th scope="col">Nome</th>
<th scope="col">Nome Fantasia</th>
</tr>
</thead>
<tbody>
<s:iterator value="entityList">
<s:url id="urlEditar" action="editar"><s:param name="id" value="%{id}"/></s:url>
<tr>
<td style="text-align:center;"><s:checkbox name="selecionados" theme="simple" fieldValue="%{id}"></s:checkbox></td>
<td> <s:a href="%{urlEditar}"><s:property value="nome"/></s:a></td>
<td> <s:a href="%{urlEditar}"><s:property value="nomeFantasia"/></s:a></td>
</tr>
</s:iterator>
</tbody>
</table>
<br/>
<div id="pager" class="pager">
<form>
<img src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/addons/pager/icons/first.png" class="first"/>
<img src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/addons/pager/icons/prev.png" class="prev"/>
<input type="text" class="pagedisplay"/>
<img src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/addons/pager/icons/next.png" class="next"/>
<img src="<%=request.getContextPath()%>/plugins/jquery/tablesorter/addons/pager/icons/last.png" class="last"/>
<select class="pagesize">
<option selected="selected" value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="<s:property value="totalRegistros"/>">todos</option>
</select>
</form>
</div>
</div>
<b class="linha_baixo_3"></b><b class="linha_baixo_2"></b><b class="linha_baixo_1"></b><b class="linha_1"></b>
</div>
</s:form>
<s:if test="#session.isEditando == true">
<div id="pagina">
<b class="linha_1"></b><b class="linha_topo_1"></b><b class="linha_topo_2"></b><b class="linha_topo_3"></b>
<div class="quadro_titulo">
<h1>Edição de Estabelecimento</h1>
</div>
<div class="quadro_conteudo" >
<br/>
<s:form id="formEditar" theme="simple" class="formulario">
<p class="formulario">Nome:
<s:textfield id="iptNome"
name="entity.nome"
value='%{entity.nome}'
theme="simple"
cssClass="formulario"/>
</p>
<br/>
<div class="submenu">
<ul>
<li><s:submit value="Salvar" action="gravar" theme="simple" /></li>
<li><s:submit value="Novo" action="incluirnovo" theme="simple" /></li>
<li><s:submit value="Cancelar" onclick="return confirmacao('Deseja cancelar a edição?');"
action="cancelar" theme="simple" /> </li>
</ul>
</div>
</s:form>
</div>
<b class="linha_baixo_3"></b><b class="linha_baixo_2"></b><b class="linha_baixo_1"></b><b class="linha_1"></b>
</div>
</s:if>
</div>
</div>
</body>
</html>