easyui datagrid editors扩展之combogrid

01	$.extend($.fn.datagrid.defaults.editors, {

02	combogrid: {

03	init:function(container, options){

04	varinput = $('<input type="text" class="datagrid-editable-input">').appendTo(container);

05	input.combogrid(options);

06	returninput;

07

},

08	destroy:function(target){

09	$(target).combogrid('destroy');

10

},

11	getValue:function(target){

12	return$(target).combogrid('getValue');

13

},

14	setValue:function(target, value){

15	$(target).combogrid('setValue', value);

16

},

17	resize:function(target, width){

18	$(target).combogrid('resize',width);

19

}

20

}

21

});

用法：

01	$('#dg').datagrid({

02	columns:[[

03	{field:'productid',name:'ProductId',width:100,

04

editor:{

05	type:'combogrid',

06

options:{

07	panelWidth:450,

08	idField:'code',

09	textField:'name',

10	url:'datagrid_data.json',

11	columns:[[

12	{field:'code',title:'Code',width:60},

13	{field:'name',title:'Name',width:100},

14	{field:'addr',title:'Address',width:120},

15	{field:'col4',title:'Col41',width:100}

16

]]

17

}

18

}

19

}

20

]]

21

});

varinsertRows=$('#test').datagrid('getChanges','inserted');
varupdateRows=$('#test').datagrid('getChanges','updated');
vardeleteRows=$('#test').datagrid('getChanges','deleted');
varchangesRows={
inserted:[],
updated:[],
deleted:[],
};
if(insertRows.length>0){
for(vari=0;i<insertRows.length;i++){
changesRows.inserted.push(insertRows[i]);
}
}

if(updateRows.length>0){
for(vark=0;k<updateRows.length;k++){
changesRows.updated.push(updateRows[k]);
}
}

if(deleteRows.length>0){
for(varj=0;j<deleteRows.length;j++){
changesRows.deleted.push(deleteRows[j]);
}
}

$.ajax({
type:"post",
url:"../stock/stock_modify.asp",
data:"inserted="+JSON.stringify(changesRows.inserted)+"&updated="+JSON.stringify(changesRows.updated)+"&deleted="+JSON.stringify(changesRows.deleted),
datatype:"json",
success:function(data){

}


})

以上是针对插入删除更新操作

jquery easyUI combobox赋值

2011-03-18 08:45

Js代码

1. <inputclass="easyui-combobox"
2. id="cc"
3. name="mallId"
4. url="${ctx}/record/mallin!getMall.action"
5. valueField="id"
6. textField="name"
7. multiple="true"
8. panelHeight="auto"
9. /></td>

name：用来和后台绑定，

url：异步json从后台的方法中获得json数据，

valueField：选取文字后对应的值

textField：显示的文字

multiple="true"：允许在下拉列表里多选

多选提交到后台会变成一个名字为mallId的Long型数组，

后台返回到前台时，给combobox赋值，代码如下：

导入c标签：<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

Js代码

1. vari=0;
2. vart=[];
3. <c:forEachitems="${mallId}"var="u">
4. t[i]=${u};
5. i++;
6. </c:forEach>
7. $('#cc').combobox('setValues',t);

这是给combobox赋很多值，

赋单个值是用：$('#cc').combobox('setValue',‘1’);