思路:点击tab切换时,触发form表单的submit请求,从而实现刷新效果
1、给tab加id:
<li class="active"><a href="#tab-1" id="prepareTab" data-toggle="tab">待办事项</a></li>
2、增加一个查询按钮,发送submit请求,可以隐藏
<button type="submit" id="searchFormSubmit" class="btn btn-primary btn-sm hide">${text('查询')}</button>
3、jquery根据id触发事件:
$('#prepareTab').click(function () {
$('#searchFormSubmit').click();
})
4、整体页面例子如下:标签:function,Form,text,jeesite,actions,tab,parameter,data,click From: https://www.cnblogs.com/dongfangzhaoyue/p/17399794.html
<% layout('/layouts/default.html', {title: 'xxx', libs: ['dataGrid']}){ %>
<div class="main-content">
<div class="box box-main">
<div class="box-header">
<div class="box-title">
<i class="fa icon-pencil"></i> ${text('xxx')}
</div>
</div>
<div class="box-body pt0 page-frame">
<div class="tabpanel_move_content">
<ul class="tabpanel_mover ui-sortable">
<li class="active"><a href="#tab-1" id="prepareTab" data-toggle="tab">待办事项</a></li>
<li><a href="#tab-2" id="finishTab" data-toggle="tab">已办事项</a></li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane active" id="tab-1">
<div class="table-form">
<#form:form id="searchForm" model="${xx}" action="${ctx}" method="post"
class="form-inline hide" data-page-no="${parameter.pageNo}" data-page-size="${parameter.pageSize}" data-order-by="${parameter.orderBy}">
<div class="form-group">
<button type="submit" id="searchFormSubmit" class="btn btn-primary btn-sm hide">${text('查询')}</button>
</div>
</#form:form>
<table id="dataGrid"></table>
<div id="dataGridPage"></div>
</div>
</div>
<div class="tab-pane" id="tab-2">
<div class="table-form">
<#form:form id="searchForm2" model="${processingDrawingTask}" action="${ctx}" method="post"
class="form-inline hide" data-page-no="${parameter.pageNo}" data-page-size="${parameter.pageSize}" data-order-by="${parameter.orderBy}">
<div class="form-group">
<button type="submit" id="searchForm2Submit" class="btn btn-primary btn-sm hide">${text('查询')}</button>
</div>
</#form:form>
<table id="dataGrid2"></table>
<div id="dataGrid2Page"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<% } %>
<script>
// 初始化DataGrid对象 -- 待办事项
$('#dataGrid').dataGrid({
searchForm: $("#searchForm"),
dataGridPage: $('#dataGridPage'),
autoGridWidth: function(){
return $('.main-content').width() - 30;
},
// 设置数据表格列
columnModel: [
{header:'${text("xx编号")}', name:'xxCode', index:'a.xx_code', width:100, align:"center"},
{header:'${text("操作")}', name:'actions', width:150, align:"center", formatter: function(val, obj, row, act){
var actions = [];
//<% if(hasPermi('tianqi:task:processingDrawingTask:edit')){ %>
actions.push('<a href="${ctx}/xxx?xxx='+row.xxx+'" class="btnList" title="${text("xx")}"><i class="fa fa-pencil"></i><span class="actions-text">xx</span></a>');
//<% } %>
return actions.join('');
}}
],
shrinkToFit: true,
// 加载成功后执行事件
ajaxSuccess: function(data){
}
});
$('#prepareTab').click(function () {
$('#searchFormSubmit').click();
})
$('#finishTab').click(function () {
$('#searchForm2Submit').click();
})
</script>