datagrid行过滤问题

zb1505196407832 发布于 2017/10/30 14:43
阅读 54
收藏 0

jsp界面如下:
<%@ page language="java" pageEncoding="UTF-8" %>
<%@ include file="../header.jsp" %>
<script src="${pageContext.request.contextPath}/static/js/keywords.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {
        var dg = $('#dg').datagrid({
            url: '${pageContext.request.contextPath}/scoreKeywords/queryList',
            pagination: true,
            striped: true,
            checkOnSelect: false,
            selectOnCheck: false,
            singleSelect: true,
            multiSort: true,
            pageSize: 20,
            sortName: "id",
            sortOrder: "desc",
            toolbar: "#tb",
            columns: [[
                {field: 'ck', checkbox: true, width: '3%'},
                {field: 'id', title: 'ID', width: '5%'},
                {field: 'find', title: '关键词', width: '10%'},
                {field: 'findType', title: '关键词所在位置', width: '10%'},
                {field: 'score', title: '关键词分数', width: '10%'},
                {
                    field: 'opt', title: '操作', width: '7%', align: 'center', formatter: function (value, row, index) {
                    return "<a onclick='Keywords.editScoreKeywords(" + row.id + ")' href='javascript:void(0)'>编辑</a>&nbsp;&nbsp;&nbsp;&nbsp;"
                        + "<a onclick='Keywords.delScoreKeywords(" + row.id + ")' href='javascript:void(0)'>删除</a>";
                }
                }
            ]],
            loadFilter: function (data) {
                if (data.result == "success") {
                    return data.responseData;
                } else {
                    layer.alert(data.responseData, {icon: 5});
                    return null;
                }
            },
            onLoadSuccess: function (data) {
                $('#dg').datagrid('options').queryParams['total'] = data.total;
            }
        });
    });


</script>

<div style="">
    <div class="datagrid-toolbar" id="tb">
        <div class="easyui-panel" title="查询" style="width: 100%; height: 130px;" data-options="collapsible:true,collapsed: false">
            <div class="search_pannel">
                <form id="searchForm" onsubmit="return false">
                    <ul>
                        <li>关键词:<input type="input" name="find" class="easyui-textbox"/></li>
                        <li>关键词分数:<input type="input" name="score" class="easyui-textbox"/></li>
                        <li>关键词分类:
                            <select name="findType" class="easyui-combobox" data-options="editable:false" style="width:100px;">
                                <option value="">请选择</option>
                                <c:forEach items="${types}" var="type">
                                    <option value="${type.id}">${type.findType}</option>
                                </c:forEach>
                            </select>
                        </li>
                    </ul>
                    <a class="btn" onclick="javascript:Common.datagridQuery('searchForm', 'dg')">查询</a>
                </form>
            </div>
        </div>
        <table cellspacing="0" cellpadding="0">
            <tbody>
            <tr>
                <td><a href="javascript:void(0)" onclick="Keywords.addScoreKeywords()" class="l-btn l-btn-small l-btn-plain" group="" id=""> <span
                        class="l-btn-left l-btn-icon-left"> <span class="l-btn-text">添加</span> <span class="l-btn-icon icon-add">&nbsp;</span>
                        </span>
                </a></td>
                <td>
                    <div class="datagrid-btn-separator"></div>
                </td>
                <td><a href="javascript:void(0)" onclick="Keywords.batchDelScoreKeywords()" class="l-btn l-btn-small l-btn-plain" group="" id=""> <span
                        class="l-btn-left l-btn-icon-left"> <span class="l-btn-text">批量删除</span> <span class="l-btn-icon icon-remove">&nbsp;</span>
                        </span>
                </a></td>
                <td>
                    <div class="datagrid-btn-separator"></div>
                </td>
                <td><a href="javascript:void(0)" onclick="Keywords.testKeywords()" class="l-btn l-btn-small l-btn-plain" group="" id=""> <span
                        class="l-btn-left l-btn-icon-left"> <span class="l-btn-text">过滤测试</span> <span class="l-btn-icon icon-filter">&nbsp;</span>
                        </span>
                </a></td>
            </tr>
            </tbody>
        </table>
    </div>

    <table id="dg" style="width: 100%; height: auto">
    </table>
</div>
<div id="dlg" style="overflow: auto;"></div>
<%@ include file="../footer.jsp" %>


js代码如下:
Common.datagridQuery = function (queryformid, datagridid) {
    var obj = Common.getFormJsonData(queryformid);
    $("#" + datagridid).datagrid("options").queryParams["total"] = -1;
    $("#" + datagridid).datagrid("options").pageNumber = 1;
    $("#" + datagridid).datagrid({
        queryParams: obj
    });
};

Common.getFormJsonData = function (id) {
    var arr = $("#" + id).serializeArray();
    var str = "({";
    $.each(arr, function (i, field) {
        str += "'" + (field.name + "':'" + $.trim(field.value) + "', ");
    });
    if (str.length > 0) {
        str = str.substring(0, str.length - 2);
    }
    str += "})";
    alert(str);
    obj = eval(str);
    return obj;
};

为什么实现不了行过滤

加载中
返回顶部
顶部