0

我正在使用具有服务器端处理、分页和过滤功能的蒲公英数据表开发一个 Web 应用程序。我使用的版本是 1.1.0 (JSP)

我想使用外部表单来更新我的数据表的数据集。该表有两个字段：开始日期，停止日期，如下所示：

<datatables:table id="myTableId" url="/results"  serverSide="true" serverparams="getFilterParams" processing="true" theme="bootstrap3" cssClass="table table-striped">
    <datatables:column title="Start Date" property="startDate" filterable="false" />
    <datatables:column title="Stop Date" property="stopDate" filterable="false" />
</datatables:table>

在外部形式中，我使用引导程序 datetimepicker

<sf:form id="searchForm">
    <div class="form-group">
        <div>Start Date</div>
        <div class='input-group date' id='startDate'>
            <input name='startDate' type='text' class="form-control" /> <span
                class="input-group-addon"> <span
                class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>
    </div>
    <div class="form-group">
        <div>Stop Date</div>
        <div class='input-group date' id='stopDate'>
            <input name='stopDate' type='text' class="form-control" /> <span
                class="input-group-addon"> <span
                class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>
    </div>
    <div>
        <button id="searchBtn" class="btn btn-primary btn-search searchButton"
            type="button" onclick="oTable_myTableId.ajax.reload();">Search</button>
    </div>
</sf:form>

Javascript

function getFilterParams(aoData) {
    aoData.push({"name" : "startDate", "value" : $('#startDate').val()});
    aoData.push({"name" : "stopDate", "value" : $('#stopDate').val()});
}

控制器

@RequestMapping(value = "/results")
    public @ResponseBody DatatablesResponse<Results> findAllForDataTables(HttpServletRequest request) {

        DatatablesCriterias dataTableCriterias = DatatablesCriterias.getFromRequest(request);

        for (ColumnDef columnDef : dataTableCriterias.getColumnDefs()) {
            switch (columnDef.getName()) {
                case "startDate":
                    columnDef.setSearch(request.getParameter("startDate"));
                    break;
                case "stopDate":
                    columnDef.setSearch(request.getParameter("stopDate"));
                    break;
            }
        }
        DataSet<Results> results = this.resultsServiceimpl.findResultsWithDatatablesCriterias(dataTableCriterias);
        return DatatablesResponse.build(results, dataTableCriterias);
    }

您能否给我一些指导，以过滤在 datetimepicker 外部表单中选择的范围内搜索所有行的结果

谢谢

4

1 回答 1

0

最近我做了同样的任务，并使用以下技术解决了这个特定问题：

  1. 我创建了一个带有 dateFrom 和 dateTo 字段的模型类。
  2. 当用户在日期选择器中选择日期并按下“确认”按钮时，服务器会收到带有包含 dateFrom 和 dateTo 的 @ModelAttribute 的发布请求。
  3. 然后我从数据库中检索具有该日期（例如 select * from table where (date between :datefrom AND :dateto)）的数据并将其发送回我的视图。
于 2016-01-18T08:57:05.613 回答