在我的应用程序发布提交后,如何刷新页面的一部分(“DIV”)?
我在插件ajaxForm中使用 JQuery.
我用“divResult”设置我的目标,但页面在“divResult”中重复你的内容.
资料来源:
我在插件ajaxForm中使用 JQuery.
我用“divResult”设置我的目标,但页面在“divResult”中重复你的内容.
资料来源:
- <script>
- $(document).ready(function() {
- $("#formSearch").submit(function() {
- var options = {
- target:"#divResult",url: "http://localhost:8081/sniper/estabelecimento/pesquisar.action"
- }
- $(this).ajaxSubmit(options);
- return false;
- });
- })
- </script>
页
- <s:form id="formSearch" theme="simple" class="formulario" method="POST">
- ...
- <input id="btTest" type="submit" value="test" >
- ...
- <div id="divResult" class="quadro_conteudo" >
- <table id="tableResult" class="tablesorter">
- <thead>
- <tr>
- <th style="text-align:center;">
- <input id="checkTodos" type="checkBox" title="Marca/Desmarcar todos" />
- </th>
- <th scope="col">Name</th>
- <th scope="col">Phone</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 id="checkSelecionado" name="selecionados" theme="simple" fieldValue="%{id}"></s:checkBox></td>
- <td> <s:a href="%{urlEditar}"><s:property value="name"/></s:a></td>
- <td> <s:a href="%{urlEditar}"><s:property value="phone"/></s:a></td>
- </tr>
- </s:iterator>
- </tbody>
- </table>
- <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="40">40</option>
- <option value="<s:property value="totalRegistros"/>">todos</option>
- </select>
- <s:label>Total de registros: <s:property value="totalRegistros"/></s:label>
- </form>
- </div>
- <br/>
- </div>
谢谢.
解决方法
要使用jquery解决这个问题,我会试试这个;
- $(document).ready(function() {
- $("#formSearch").submit(function() {
- var options = {
- /* target:"#divResult",*/
- success: function(html) {
- $("#divResult").replaceWith($('#divResult',$(html)));
- },url: "http://localhost:8081/sniper/estabelecimento/pesquisar.action"
- }
- $(this).ajaxSubmit(options);
- return false;
- });
- });
或者,您可以让服务器只返回需要插入div的html而不是html文档的其余部分.
我真的不知道TableSorter插件,但我知道每次重新加载元素时都需要重新初始化TableSorter插件.所以在你的成功函数中添加一行,例如
- success: function(html) {
- var resultDiv = $("#divResult").replaceWith($('#divResult',$(html)));
- $('table.tablesorter',resultDiv).TableSorter();
- }