您的位置:首页 > 产品设计 > UI/UE

easyui datagrid综合功能demo实现

2016-06-25 17:36 369 查看

实现功能:行内修改,批量行内添加,多条件查询;(查询当中不是联查)

JavaScript:

$(function(){
<span style="font-family: Arial, Helvetica, sans-serif;">                    initGrid8();</span>
<span style="font-family: Arial, Helvetica, sans-serif;">                     });</span>
//定义初始化方法
function initGrid8() {
//初始化comblbox数据
initComoboxData();
//给姓名录入框添加清楚图标
$('#txtname').textbox().textbox('addClearBtn', 'icon-clear');
//为日期组合框设置默认值
var now = new Date();
var time1 = now.getFullYear()-50 + "-" + (now.getMonth()+1).toString() + "-" + now.getDate().toString();
var time2 = now.getFullYear() + "-" + (now.getMonth() + 1).toString() + "-" + now.getDate().toString();
$("#datebox1").datebox('setValue', time1);
$("#datebox2").datebox('setValue', time2);
//各种查询
$("#btn_save").linkbutton({ onClick: function () { grid8Accept(); return false;  }});
//$("#btn_search").linkbutton({ onClick: function () { doSearch(); } });
$("#cmbGender").combobox({ onChange: function () { doSearch(); } });
//$("#deptCombobox8").combobox({ onChange: function () { doSearch(); } });
//$("#deptCombobox8").combobox({ onChange: function () { alert(); doSearch(); } });
//$("#datebox1").datebox({ onChange: function (nValue, oValue) { if (oValue != null && oValue != '') { doSearch(); }}});
//主体:
$("#dg8").datagrid({
height: 300,
width: 800,
title: '自定义demo1',
fitColumns: true,

toolbar: '#tb8',
url: '/Home/grid8GetData',
queryParams: tbForm8Json("tbForm8"),
rownumbers: true,
pagination: true,

pageNumber:1,
sortName: 'NAME',
sortOrder: 'desc',
multiSort: true,
pageList: [5,10,15,20,30,50],
pageSize:10,
columns: [[
{ field: 'ck', checkbox: true },
{ field: 'EMPID', title: '员工编号', width: 80, align: 'CENTER',sortable:true},
{
field: 'NAME', title: '姓名', width: 120, align: 'CENTER', sortable: true,
editor: { type: 'text' }
},
{
field: 'GENDER', title: '性别', width: 80, align: 'CENTER', sortable: true,
editor: { type: 'combobox', options: { textField: 'label', valueField: 'value', data: [{ label: '男', value: '1' }, { label: '女', value: '0' }] } }
},
{
field: 'BIRTHDAY', title: '出生日期', width: 80, align: 'CENTER', sortable: true,
editor: { type: 'datebox' }
},
{
field: 'DEPTNO', title: '部门', width: 80, align: 'CENTER', sortable: true,
editor: {
type: 'combobox', options: {
textField: 'NAME', valueField: 'DEPTID', url: '/Home/initCombobox8Data',
onLoadSuccess: function (res) {
var str = JSON.parse(res);
if (editIndex != undefined)
{
var ed = $('#dg8').datagrid('getEditor', { index: editIndex, field: 'DEPTNO' });
$(ed.target).combobox('loadData', str);
}

if (addRowsCount > 0)
{
var ed = $('#dg8').datagrid('getEditor', { index: 0, field: 'DEPTNO' });
$(ed.target).combobox('loadData', str);
}
}
}
}
}
]],
onLoadSuccess: function (res) {

},
onDblClickRow: function (index,row){
grid8OnClickRow(index,row);
}

});

}

//文本框添加清除图标方法
$.extend($.fn.textbox.methods, {
addClearBtn: function (jq, iconCls) {
return jq.each(function () {
var t = $(this);
var opts = t.textbox('options');
opts.icons = opts.icons || [];
opts.icons.unshift({
iconCls: iconCls,
handler: function (e) {
$(e.data.target).textbox('clear').textbox('textbox').focus();
$(this).css('visibility', 'hidden');
}
});
t.textbox();
if (!t.textbox('getText')) {
t.textbox('getIcon', 0).css('visibility', 'hidden');
}
t.textbox('textbox').bind('keyup', function () {
var icon = t.textbox('getIcon', 0);
if ($(this).val()) {
icon.css('visibility', 'visible');
} else {
icon.css('visibility', 'hidden');
}
});
});
}
});
//文本框搜索事件:
function doSearch() {
$("#dg8").datagrid('reload', tbForm8Json("tbForm8"));
};
//添加行
function doAdd() {
$("#dg8").datagrid('insertRow', {
index: 0, row: {
EMPID: 88,

NAME:'',
GENDER:1,
BIRTHDAY:'',
DEPTNO:1
}
}).datagrid('selectRow', 0).datagrid('beginEdit', 0);

if (editIndex != undefined)
{
editIndex += 1;
}

addRowsCount += 1;
};
//为表单数据转为json:
function tbForm8Json(id) {

var arr = $("#" + id).serializeArray()
var jsonStr = "";

jsonStr += '{';
for (var i = 0; i < arr.length; i++) {
jsonStr += '"' + arr[i].name + '":"' + arr[i].value + '",'
}
jsonStr = jsonStr.substring(0, (jsonStr.length - 1));
jsonStr += '}'

var json = JSON.parse(jsonStr);

return json
}
//combobox初始化方法
function initComoboxData() {
$("#deptCombobox8").combobox({
url: '/Home/initCombobox8Data',
valueField: 'DEPTID',
textField: 'NAME',
width:70,
onLoadSuccess: function (res) {
var str = JSON.parse(res);
var a = {};
a.DEPTID = '-1';
a.NAME = "不限";
//数组中插入对象
str.unshift(a);
$("#deptCombobox8").combobox('loadData', str);

},
onChange: function (newValue,oldValue) {
if (oldValue != null && oldValue != '') {

doSearch();
}
}
})

$('#deptCombobox8').combobox('select', '-1');

}

//行内编辑所需各个方法:
function grid8EndEditing() {
if (editIndex == undefined) { return true }
if ($('#dg8').datagrid('validateRow', editIndex)) {
$('#dg8').datagrid('endEdit', editIndex);
editIndex = undefined;
return true;
} else {
return false;
}
}
//添加grid的双击行事件方法
function grid8OnClickRow(index,row) {
if (editIndex != index) {
if (grid8EndEditing()) {
$('#dg8').datagrid('selectRow', index)
.datagrid('beginEdit', index);
editIndex = index;
} else {
$('#dg8').datagrid('selectRow', editIndex);
}
}
}

function grid8Accept() {
//关掉编辑行及添加行的编辑状态
$('#dg8').datagrid('endEdit', editIndex);

for (var i = 0; i < addRowsCount; i++)
{
$('#dg8').datagrid('endEdit', i);
}
if (grid8EndEditing()) {

//手动添加保存代码

var rows = $('#dg8').datagrid('getChanges');
var strArr = new Array();
strArr[0] = "EMPID";
strArr[1] = "NAME";
strArr[2] = "GENDER";
strArr[3] = "BIRTHDAY";
strArr[4] = "DEPTNO";
var employees = JSON.stringify(rows, strArr);

if ($.trim(employees) != "[]") {
$.post('/Home/grid8SaveEditions', employees, function (res) {
var resObj = eval('(' + res + ')');
var resTxt = "共添加:" + resObj.addTotal + "   成功:" + resObj.addSuccessCount + "\n共修改:" + resObj.editTotal + "  成功:" + resObj.editSuccessCount;
alert(resTxt);
}, 'text');
$('#dg8').datagrid('acceptChanges');
}
else {
alert("您没有做任何添加或修改,请先操作再保存");
};
}
}
controller:

public string grid8GetData()
{
//获取datagrid排序和分页信息:
string sortName=Request.Form["sort"];
string sortOrder=Request.Form["order"];
int pageIndex = Convert.ToInt32(Request.Form["page"]);
int pageSize = Convert.ToInt32(Request.Form["rows"]);
//字符串转换数据库日期格式:(需要命名空间System.Globalization)
DateTimeFormatInfo dtFormat = new System.Globalization.DateTimeFormatInfo();
dtFormat.ShortDatePattern = "yyyy-mm-dd";
List<OracleParameter> parmList =new List<OracleParameter> {
new  OracleParameter(":NAME","%"+Request.Form["name"]+"%"),
//new  OracleParameter(":GENDER",Convert.ToInt16( Request.Form["gender"])),
//new  OracleParameter(":DEPTNO",Convert.ToInt32( Request.Form["deptname"])),
new  OracleParameter(":STIME",Convert.ToDateTime(Request.Form["stime"],dtFormat)),
new  OracleParameter(":ETIME",Convert.ToDateTime(Request.Form["etime"],dtFormat))
};
StringBuilder sb= new StringBuilder(" ");
if(Request.Form["gender"]!="-1")
{
parmList.Add(new OracleParameter(":GENDER", Convert.ToInt16(Request.Form["gender"])));
sb.Append("and gender=:GENDER  ");
}
if (Request.Form["deptname"] != "-1")
{
parmList.Add( new OracleParameter(":DEPTNO", Convert.ToInt32(Request.Form["deptname"])));
sb.Append("and deptno=:DEPTNO");
}
string where = sb.ToString();
int total = 0;
DataSet ds = grid8Service.GetEmployeesByPaging(where,sortName,sortOrder,pageSize,pageIndex,out total,parmList.ToArray() );
//利用hashtable容器为datagrid提供元数据
Hashtable hs = new Hashtable();
var formatter = new IsoDateTimeConverter();
formatter.DateTimeFormat = "yyyy-MM-dd";
hs.Add("total", total);
hs.Add("rows", ds.Tables[0]);
//序列化约束:
return JsonConvert.SerializeObject(hs, formatter);
//string jsonStr = JsonConvert.SerializeObject(ds.Tables[0],formatter);
//return jsonStr;
}

public ActionResult initCombobox8Data()
{
DataSet ds = grid8Service.GetAllDept();
string jsonStr = JsonConvert.SerializeObject(ds.Tables[0]);
return Json(jsonStr);
}

public string grid8SaveEditions()
{
//手写表单提交字符串转化对象集合:
string data = Request.Form[0];
data = data.Replace('[', ' ');
data = data.Replace(']', ' ');

string[] sss = { "}," };
string[] ss = data.Split(sss, StringSplitOptions.None);
int i = ss.Length;
int lastStrLength = ss[i - 1].Length;
ss[i - 1] = ss[i - 1].Remove(lastStrLength - 2, 1);
List<Employee_wcj> emps = new List<Employee_wcj>();

foreach (string s in ss)
{

string s1 = s + "}";
Employee_wcj emp = JsonConvert.DeserializeObject<Employee_wcj>(s1);
emps.Add(emp);
}
string res = grid8Service.grid8SaveEditions(emps);
return res;
}

服务层:

 public  class WCJgrid8
    {
        public DataSet GetAllDept()
        {
            string sql = "select * from department_w ";
            return OracleHelper.Query(sql);
        }
        public DataSet GetEmployeesByPaging(string where, string sortName,string sortOrder, int pageSize, int currentPage, out int resultCount, OracleParameter[] parms)
        {
            String sql = @"select * from employee_w where NAME LIKE :NAME   and BIRTHDAY between :STIME  AND :ETIME"+where;
            //String sql = @"select emp.empid,emp.name as emp_name,emp.gender,emp.birthday,emp.deptno,dept.name dept_name from employee_w AS emp join employee_w AS dept on emp.deptno=dept.deptid where emp.NAME LIKE :NAME   and  emp.BIRTHDAY between :STIME  AND :ETIME" + wh
d65f
ere;
            StringBuilder sortStr = new StringBuilder();
            string orderby = "";
            if (!string.IsNullOrEmpty(sortName))
            {
                if (sortName.Contains(','))
                {
                    for (int i = 0; i < sortName.Split(',').Length; i++)
                    {
                        sortStr .Append( sortName.Split(',')[i] + " " + sortOrder.Split(',')[i] + ",");
                    }
                    sortStr = sortStr.Remove(sortStr.Length-1,1);
                }
                else
                {
                    sortStr .Append( sortName + " " + sortOrder);
                }
                orderby = sortStr.ToString();
            }
            else
            {
                orderby = "";
            }

            return OracleHelper.FindPageBySql(sql, orderby, pageSize, currentPage, out resultCount, parms);
        }
        public string grid8SaveEditions( List<Employee_wcj> emps)
        {
            int editTotal = 0;
            int addTotal = 0;
            int editSuccessCount = 0;
            int addSuccessCount = 0;
            foreach(Employee_wcj emp in emps)
            {
                if (emp.EMPID != 88)
                {
                    editTotal += 1;
                    editSuccessCount += grid8SaveUpdate(emp);
                }
                else
                {
                    addTotal += 1;
                    addSuccessCount += grid8SaveAdd(emp);
                }
            }
            return "{editTotal:" + editTotal.ToString() + ",addTotal:" + addTotal.ToString() + ",editSuccessCount:" + editSuccessCount.ToString() + ",addSuccessCount:" + addSuccessCount.ToString() + "}";
        }
        public int grid8SaveUpdate(Employee_wcj emp)
        {
           
            //string sql = "update employee_w set 
name='"+emp.NAME+"',gender="+emp.GENDER+",birthday='"+emp.BIRTHDAY+"',deptno="+emp.DEPTNO.ToString()+" where empid="+emp.EMPID.ToString()+";";
            //int rows = OracleHelper.ExecuteNonQuery(sql,CommandType.Text);
            string sql = "update employee_w set name=:name ,gender=:gender, birthday=:birthday,deptno=:deptno where empid=:empid";
            DateTimeFormatInfo dtFormat = new System.Globalization.DateTimeFormatInfo();
            dtFormat.ShortDatePattern = "yyyy-MM-dd";
            OracleParameter[] para = { 
                                         new OracleParameter(":name",emp.NAME),
                                         new  OracleParameter(":gender",int.Parse(emp.GENDER)),
                                         new  OracleParameter(":birthday", Convert.ToDateTime(emp.BIRTHDAY,dtFormat )),
                                         new  OracleParameter(":deptno",Convert.ToInt32(emp.DEPTNO)),
                                         new  OracleParameter(":empid",Convert.ToInt32(emp.EMPID))
                                     };
            int rows = OracleHelper.ExecuteNonQuery(sql, CommandType.Text, para);
            return rows;
        }
        public int grid8SaveAdd(Employee_wcj emp)
        {
             //参数数组和todate()方法结合使用的sql语句

            //string sql = "insert into employee_w values("+emp.EMPID.ToString()+",'"+emp.NAME+"',"+emp.GENDER.ToString()+",to_date('"+emp.BIRTHDAY+"','yyyy-mm-dd'),"+emp.DEPTNO.ToString()+");";
            //int rows = OracleHelper.ExecuteNonQuery(sql,CommandType.Text);
            string sql = "insert into employee_w values(:empid,:name,:gender,to_date(:birthday,'yyyy-mm-dd'),:deptno)";
            DateTimeFormatInfo dtFormat = new System.Globalization.DateTimeFormatInfo();
            dtFormat.ShortDatePattern = "yyyy-MM-dd";
            OracleParameter[] para = { 
                                         new OracleParameter(":name",emp.NAME),
                                         new  OracleParameter(":gender",int.Parse(emp.GENDER)),
                                         new  OracleParameter(":birthday", Convert.ToDateTime(emp.BIRTHDAY,dtFormat )),
                                         new  OracleParameter(":deptno",Convert.ToInt32(emp.DEPTNO)),
                                         new  OracleParameter(":empid",Convert.ToInt32(emp.EMPID))
                                     };
            int rows = OracleHelper.ExecuteNonQuery(sql, CommandType.Text, para);
            return rows;
        }
    }

文章来源:http://blog.csdn.net/wcj920946195
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: