datagrid中添加下拉框combobox

web前端 专栏收录该内容
17 篇文章 0 订阅

js:

var editIndex = undefined;
function initDataEditDg() {
				var _KKXMItems = [{ "FYLXID": 0, "FYLXMC": "现金" }, { "FYLXID": 1, "FYLXMC": "货扣" }]
				$("#dataEditDg").datagrid({
					title: '',
					idField: 'HTH',
					rownumbers: true,
					singleSelect: false,
					height: 330,
					remoteSort: true,
					columns: [
						[{
							title: '操作',
							field: 'del',
							width: '60',
							align: 'center',
							formatter: function(value, row, index) {
								return '<a  href="#" onclick="dataEditDg_delrow(\'' + row.JSDH + '\')">删除</a>';
							}
						}, {
							title: '单号',
							field: 'JSDH',
							width: 110,
							align: 'center',
						}, {
							title: '类型',
							field: 'FYLXID',
							halign: 'center',
							width: 130,
							formatter: function(value) {
								for(var i = 0; i < _KKXMItems.length; i++) {
									if(_KKXMItems[i].FYLXID == value)
										//显示下拉框的名称,不是id
										return _KKXMItems[i].FYLXMC;
								}
							},
							editor: {
								type: 'combobox',//下拉框
								options: {
									valueField: 'FYLXID',//对应为表格中的field
									textField: 'FYLXMC',//显示值
									editable: false,
									//数据,可后台,可写死(演示为固定),后台可根据ajax,自己获取,先获取到为全局变量,在放入data中。
									data: _KKXMItems,
									required: false
								}
							}
						}]
					],
					onLoadError: function(res) {
						$.messager.alert("加载错误", res.responseText, 'error');
					},
					onClickRow: function(index, rowData) {
						if(editIndex != index) {
							if(endEditing()) {//行点击事件,让其可编辑
								$('#dataEditDg').datagrid('selectRow', index).datagrid('beginEdit', index);
								editIndex = index;
							} else {
								$('#dataEditDg').datagrid('selectRow', index).datagrid('endEdit', index);
							}
						}
					}
				});
			}
 function endEditing() {
            if (editIndex == undefined) { return true }
            if ($('#dataEditDg').datagrid('validateRow', editIndex)) {
                $('#dataEditDg').datagrid('endEdit', editIndex);
                editIndex = undefined;
                return true;
            } else {
                return false;
            }
        }

页面html

<div data-options="region:'center',title:'',split:true" style="padding: 5px; background: #eee; margin: 10px 0;">
					<table id="dataEditDg"></table>
				</div>
  • 2
    点赞
  • 5
    评论
  • 3
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

评论 5 您还未登录,请先 登录 后发表或查看评论
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页

打赏作者

zk_Kang

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值