Jquery easyui从零单排之datagrid多行数据删除

datagrid选中的多行数据删除功能的实现


一、前台代码:

<head>
    <meta charset="UTF-8">
    <title>Start from zero</title>
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.1/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.1/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.1/demo/demo.css">
    <script type="text/javascript" src="jquery-easyui-1.4.1/jquery.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
</head>
<body>
    <form id="fm">
    <table id="dg" title="Client Side Pagination" toolbar="#tb" fitcolumns="true" rownumbers="true"
        showfooter="true" style="width: 640px; height: 600px" data-options="
				remoteSort:false,
                rownumbers:true,
				singleSelect:false,
				autoRowHeight:true,
				pagination:true,
                showFooter: true,
                fitColumns: true,
				pageSize:20">
        <thead frozen="true">
            <tr>
                <th data-options="field:'ck',checkbox:true,width:40">
                </th>
                <th data-options="field:'LoginID',width:100" sortable="true">
                    LoginID
                </th>
            </tr>
        </thead>
        <thead>
            <tr>
                <th data-options="field:'UserName',width:120" sortable="true">
                    UserName
                </th>
                <th data-options="field:'Sex',align:'center',width:80" sortable="true">
                    Sex
                </th>
                <th data-options="field:'Department',width:140" sortable="true">
                    Department
                </th>
                <th data-options="field:'Age',width:80" sortable="true">
                    Age
                </th>
            </tr>
        </thead>
    </table>
    <div id="tb" style="padding: 3px">
        <input id="btn_delete" type="button" value="Deletes" οnclick="DeleteData()" />
    </div>
    <script type="text/javascript">
        function getData()
        {
            $('#dg').datagrid({
                url: 'Handler.ashx',
                method: 'get',
                striped: true,
                title: "员工列表",
                onSortColumn: function (sort, order)
                {
                    //alert("sort:" + sort + ",order:" + order + "");
                    $('#dg').datagrid('reload', {
                        sort: sort,
                        order: order
                    });
                }
            })
        }

        function pagerFilter(data)
        {
            if (typeof data.length == 'number' && typeof data.splice == 'function') {	// is array
                data = {
                    total: data.length,
                    rows: data
                }
            }
            var dg = $(this);
            var opts = dg.datagrid('options');
            var pager = dg.datagrid('getPager');
            pager.pagination({
                onSelectPage: function (pageNum, pageSize)
                {
                    opts.pageNumber = pageNum;
                    opts.pageSize = pageSize;
                    pager.pagination('refresh', {
                        pageNumber: pageNum,
                        pageSize: pageSize
                    });
                    dg.datagrid('loadData', data);
                }
            });
            if (!data.originalRows) {
                data.originalRows = (data.rows);
            }
            var start = (opts.pageNumber - 1) * parseInt(opts.pageSize);
            var end = start + parseInt(opts.pageSize);
            data.rows = (data.originalRows.slice(start, end));
            return data;
        }

        function DeleteData()
        {
            $("#test").val("deletes");
            var ids = ""; 
            var rows = $('#dg').datagrid('getSelections');
            if (rows.length > 0) {
                for (var i = 0; i < rows.length; i++) {
                    ids += rows[i].LoginID + "|";
                }
                if (confirm("确认要删除?")) {
                    $('#dg').datagrid('reload', {
                        test: $('#test').val(),
                        array: ids
                    });
                    
                }
            }
            else {
                alert('请选择要删除的数据行!');
            }
            $("#test").val("");
            $('#dg').datagrid('reload', {
                test: $('#test').val(),
                        });
        }
        $(function ()
        {
            $('#dg').datagrid({ loadFilter: pagerFilter }).datagrid('loadData', getData());
        });
    </script>
    <div id="dlg">
    </div>
    <input name="Test" id="test" type="hidden" />
   
    </form>
</body>
</html>

这里遇到点问题:

 function DeleteData()
        {
            $("#test").val("deletes");
            var ids = ""; 
            var rows = $('#dg').datagrid('getSelections');
            if (rows.length > 0) {
                for (var i = 0; i < rows.length; i++) {
                    ids += rows[i].LoginID + "|";
                }
                if (confirm("确认要删除?")) {
                    $('#dg').datagrid('reload', {
                        test: $('#test').val(),
                        array: ids
                    });
                    
                }
            }
            else {
                alert('请选择要删除的数据行!');
            }
          <span style="color:#ff0000;">  $("#test").val("");
            $('#dg').datagrid('reload', {
                test: $('#test').val(),
                        });</span>
        }

        1.不加这几行代码,删除数据后,页面不刷新,也就是datagrid没有重新加载数据,真是恼火,个人感觉上面几行的 $('#dg').datagrid('reload', {这个已经请求重新加载了啊,不知道为什么没有反应。


        2.要是有大神了解这里的话,还请留言或者私信指导一下,在这里谢了。


        3.test依然是操作标识,给它赋值deletes,array为所有选中行的id集合,我是通过拼接字符串,然后把整个字符串传向处理页面。感觉这样子不是很灵性,觉得应该把这些被选中的行id添加到一个数组中,把这个数组的数组名传过去就行了,不过这种方法,我在一般处理程序里获取数组时遇到了问题,表示现在还不会获取数组,实在是汗颜。


二、一般处理程序Handler.ashx:

<%@ WebHandler Language="C#" Class="Handler" %>

using System;
using System.Web;
using System.Data;
using System.Data.SqlClient;
using System.IO;
using System.Collections.Generic;
using System.Text.RegularExpressions;
using Newtonsoft.Json;
using System.Text;

public class Handler : IHttpHandler {

    public void ProcessRequest(HttpContext context)
    {
        string test = context.Request.QueryString["test"];//前台传的标示值    
        string username = context.Request.QueryString["username"];//前台传的标示值    
        string loginid = context.Request.QueryString["loginid"];//前台传的标示值   
        string array = context.Request.QueryString["array"];//前台传的id集合   
        string sort = !string.IsNullOrEmpty(context.Request.QueryString["sort"])?context.Request.QueryString["sort"]:"LoginID"; 
        string order = !string.IsNullOrEmpty(context.Request.QueryString["order"])?context.Request.QueryString["order"]:"asc";
        if (string.IsNullOrEmpty(test))
        {
            Query(context,sort,order);
        }
        else if (test == "search")
        {
            SearchData(context, username, loginid);
        }
        else if (test == "deletes")
        {
            DeleteData(context, array);
        }
    }
    public void Query(HttpContext context,string sort,string order)
    {
        context.Response.ContentType = "text/plain";
        SqlHelp sqla = new SqlHelp();
        string stra = "select * from tTestTable order by "+sort+" "+order;
        
        DataTable dta = sqla.GetDataTable(stra);
        sqla.SqlClose();

        string json = JsonConvert.SerializeObject(dta);

        context.Response.Write(json);

    }
    public void SearchData(HttpContext context, string username, string loginid)
    {
        context.Response.ContentType = "text/plain";

        SqlHelp sqlb = new SqlHelp();
        string strb = "select * from tTestTable where 1=1";
        if (!string.IsNullOrEmpty(username))
        {
            strb += " and " + "UserName" + " like '%" + username + "%'";
        }
        if (!string.IsNullOrEmpty(loginid))
        {
            strb += " and " + "LoginID" + " like '%" + loginid + "%'";
        }
        strb += " order by LoginID desc";
        DataTable dtb = sqlb.GetDataTable(strb);
        sqlb.SqlClose();

        string jsonb = JsonConvert.SerializeObject(dtb);

        context.Response.Write(jsonb);

    }
    public void DeleteData(HttpContext context, string array)
    {
        context.Response.ContentType = "text/plain";
        array = array.TrimEnd('|');
        string[] loginids = array.Split('|');
        for (int i = 0; i < array.Length; i++)
        {
            SqlHelp sqlc = new SqlHelp();
            string strc = "delete from tTestTable where LoginID='" + loginids[i] + "'";
            sqlc.ExecuteNonQuery(strc);
            sqlc.SqlClose();
        }
        SqlHelp sqla = new SqlHelp();
        string stra = "select * from tTestTable order by LoginID asc";

        DataTable dta = sqla.GetDataTable(stra);
        sqla.SqlClose();

        string json = JsonConvert.SerializeObject(dta);

        context.Response.Write(json);  
    }
    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

}


三、运行结果截图:



        感觉还有好多东西不明白,有待提高啊,加油......

发布了61 篇原创文章 · 获赞 9 · 访问量 20万+
展开阅读全文

SSH 框架,查询多条记录并执行删除操作,删除之后再进行刷新。重复“删除”、“刷新”造成内存溢出

08-27

使用SSH框架开发一个后台管理系统。有个管理新闻的模块。需要查询全部新闻,单条或者批量删除,然后重新查询显示新闻。重复几次就会崩掉。控制台显示下面的异常。有些数据量很小的查询、删除,重复几次也会出现这个状况。网上也找了一些解决方法,比如在tomcat中设置内存大一些。但是不管用。求教~~~ 下面是异常: Exception in thread "http-apr-8080-exec-6" java.lang.OutOfMemoryError: PermGen space at java.lang.ClassLoader.findBootstrapClass(Native Method) at java.lang.ClassLoader.findBootstrapClassOrNull(ClassLoader.java:1070) at java.lang.ClassLoader.loadClass(ClassLoader.java:414) at java.lang.ClassLoader.loadClass(ClassLoader.java:412) at sun.misc.Launcher$AppClassLoader.loadClass(Launcher.java:308) at java.lang.ClassLoader.loadClass(ClassLoader.java:412) at java.lang.ClassLoader.loadClass(ClassLoader.java:358) at org.apache.catalina.valves.ErrorReportValve.report(ErrorReportValve.java:173) at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:133) at org.apache.catalina.valves.AccessLogValve.invoke(AccessLogValve.java:936) at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:118) at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:407) at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1004) at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:589) at org.apache.tomcat.util.net.AprEndpoint$SocketProcessor.run(AprEndpoint.java:1852) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1145) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:615) at java.lang.Thread.run(Thread.java:744) 问答

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览