easyui

ForgetLove
浏览: 24471 次
性别:
来自: 杭州
最近访客更多访客>>

xhj8816216
eandy
褚耀辉
zhoujunzhao
博主相关

博客
微博
相册
留言
关于我
文章分类

社区版块

存档分类

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>

<link rel="stylesheet" type="text/css" href="../easyui/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css">
<script type="text/javascript" src="../easyui/jquery.min.js"></script>
<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../easyui/easyui-lang-zh_CN.js"></script>


<script type="text/javascript">

    function jsonTimeStamp(milliseconds) {
        if (milliseconds != "" && milliseconds != null
                && milliseconds != "null") {
            var datetime = new Date();
            datetime.setTime(milliseconds);
            var year = datetime.getFullYear();
            var month = datetime.getMonth() + 1 < 10 ? "0"
            + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
            var date = datetime.getDate() < 10 ? "0" + datetime.getDate()
                    : datetime.getDate();
            var hour = datetime.getHours() < 10 ? "0" + datetime.getHours()
                    : datetime.getHours();
            var minute = datetime.getMinutes() < 10 ? "0"
            + datetime.getMinutes() : datetime.getMinutes();
            var second = datetime.getSeconds() < 10 ? "0"
            + datetime.getSeconds() : datetime.getSeconds();
            return year + "-" + month + "-" + date + " " + hour + ":" + minute
                    + ":" + second;
        } else {
            return "";
        }

    }

    function updateWebsite() {

        //获取选择的复选框
        var checkedItems = $('#resultList').datagrid('getChecked');
        var names = [];
        var ids = "";
        $.each(checkedItems, function (index, item) {
            //获取当前选择行在表格中的索引
            var index2 = $('#resultList').datagrid('getRowIndex', item);
            names.push(item.id);//把要传到后台的id存起来
            ids += item.id + ",";

            $('#resultList').datagrid('deleteRow', index2);//删除当前表格的选中行，页面效果（不用刷新）
        });
//        console.log(names.join(","));

        if (confirm("确认删除数据？条数 ： " + names.length)) {
            $.ajax({
                type: "post",
                data: {ids: ids},
                url: "/api/adminUpdate.do?type=MON",
                dataType: "json",
                error: function (data) {
                    alert("操作异常：  " + data.process_msg);
                },
                success: function (data) {
                    var result = data.result;
                    if (result) {
                        alert("操作成功!删除成功  " + data.deleteData + " 条数据，删除失败  " + data.deleteError + " 条");
                        $('#resultList').datagrid('reload');
                    } else {
                        alert("操作失败" + data.process_msg);
                    }
                }
            });
        }
    }

    $(document).ready(function () {
        $('#resultList').datagrid({
            columns: [[
                {field: 'checkbox', checkbox:true},
                {field: 'id',title:'id'},
                {field: 'CATEGORY', title: '分类', width: '7%', sortable: 'true',formatter: function(value,row,index){
                    if(value=='1'){
                        return "分类1";
                    }else if(value=='2'){
                        return "分类2";
                    }else if(value=='3'){
                        return "分类3";
                    }else{
                        return "<font color='blue'>" + value + "</font>";
                    }

                }},
                {field: 'WEBSITE', title: 'WEBSITE', width: '7%', sortable: 'true'},
                {field: 'MONITOR', title: '字段名', width: '7%', sortable: 'true'},
                {field: '_RULES', title: '描述', width: '7%', sortable: 'true'},
                {field: 'TABLE', title: '表', width: '10%', sortable: 'true'},
                {field: 'code', title: 'code', width: '15%', sortable: 'true'},
                {field: 'LOGIN_NAME', title: '登录名', width: '13%', sortable: 'true'},
                {field: 'WEBSITE_NAME', title: '城市', width: '7%', sortable: 'true'},
                {field: 'CREATE_DATE', title: '创建时间', width: '10%', sortable: 'true',formatter:jsonTimeStamp}
            ]],
            singleSelect: false,
            selectOnCheck: true,
            checkOnSelect: true
//            ,
//            onDblClickCell: function (rowIndex, field, value) {
//                $('#showParamsByValue').html(value);
//                $('#restartDialog').window('open');
//            }
        });

        var pager = $('#resultList').datagrid('getPager');
        $(pager).pagination({
            pageSize: 20,//每页显示的记录条数，默认为10
            onSelectPage: function (pageNumber, pageSize) {
                $(this).pagination('loading');
                $('#resultList').datagrid("reload", {pageNo: pageNumber, pageSize: pageSize});
                $(this).pagination('loaded');
            }
        });

    });

    //关闭弹层显示
    function closeWindow(){
        $('#restartDialog').window('close');
    }


    function page_search() {
        var category = $("#category").val();
        var website = $("#website").val();

        if(category == -1){
            category = "";
        }

        // 先通过ajax获取数据，然后再传给datagrid
        $.ajax({
            method : 'POST',
            url : '/api/adminQuery.do?type=MO&category='+category + "&website=" + website,
            async : false,
            dataType : 'json',
            beforeSend : function(jqXHR) {
                jqXHR.setRequestHeader('Authorization', 'Bearer '
                        + '3feee5b76d8e698f4');
            },
            success : function(data) {


                var basiclist = [];
                basiclist = data.raw_data;

                if(data.process_code != 'SCCS104'){
                    alert(data.process_msg);
                }else if(basiclist.length == 0){
                    alert("没有数据");
                }

                $('#resultList').datagrid("loadData", basiclist);
                var basicdata = basiclist;
                $('#resultList').datagrid("loadData", basicdata.slice(0, 20));
                $('#resultList').datagrid("getPager").pagination({
                    total:basicdata.length,
                    onSelectPage:function (pageNo, pageSize) {
                        var start = (pageNo - 1) * pageSize;
                        var end = start + pageSize;
                        $("#resultList").datagrid("loadData", basicdata.slice(start, end));
                        $(this).pagination('refresh', {
                            total:basicdata.length,
                            pageNumber:pageNo
                        });
                    }
                });

            },
            error : function() {
                alert('error');
            }
        });


    }

</script>

<style>

    #showParamsByValue {
        margin-top: 2%;
    }

    .data-tips-info {
        font-size: small;
        font-weight: lighter;
        margin-top: 3%;
    }

    tbody tr{
        height: 40px !important;
    }

    body {
        font-size: 20px !important;
    }

</style>

<div class="search-main">
    <div class="search-conditions">
        分类:
        <select name="category" id="category" >
            <option value="-1">请选择</option>
            <option value="1">分类1</option>
            <option value="2">分类2</option>
            <option value="3">分类3</option>
        </select>
        website:<input type="text" name="website" id="website" class="easyui-textbox" style="width:10%"/>
        <button name="search" class="easyui-linkbutton" style="width:60px" onclick="page_search();">查 询</button>
    </div>
    <p></p>
    <div id="tt" class="easyui-tabs" style="width:100%;height:160%;">
        <div title="查询结果" style="padding:10px;height:97%;" id="basic" align="center">

            <div id="tb" style="width: 98%;" align="left">
                <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" onclick="updateWebsite()">删 除</a>
               
            </div>

            <table id="resultList" class="easyui-datagrid c-datagrid" title="查询结果" style="height:80%"
                   data-options="singleSelect:true,collapsible:true,
           				 method:'post', pagination:'true', pageSize:'20',sortName:'id',sortOrder:'asc',rownumbers:'true'">
            </table>

        </div>

    </div>
</div>
页面代码如上
实现功能：不使用easyui 的原生删除方法（直接传删除链接）。进行批量删除，通过获取选中行前的复选框在当前表格的索引进行页面无刷新效果实现