EasyUI 设置DataGrid 内文本框换行，可编辑

最新推荐文章于 2023-06-15 11:16:43 发布

原创最新推荐文章于 2023-06-15 11:16:43 发布 · 723 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

EasyUI 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了一种通过AJAX和Datagrid实现的服务状态实时监控与详细展示的技术，包括服务接口名称和服务状态的可视化呈现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function getServiceState() {
	$('#datagrid').datagrid({
		url: $.navinfo.contextPath + '/MonitorSysAction.do?method=getHttpState',
		striped: true,
		collapsible: true,
		remoteSort: false,
		fit: true,
		fitColumns: true,
		singleSelect: true,
		pageNumber: 1,
		nowrap:false,
		pageSize: 10,
		pagination: false,
		columns : [ [  {
			field : 'serviceName',
			title : '服务接口名称',
			width : 10,
			align:'left',
			formatter : function(value, row, index) {
				return row.serviceName;
			}
		}, {
			field : 'serviceState',
			title : '服务接口状态',
			width : 10,
			align:'left',
			editor: {
                type: 'validatebox',
                	options: { required: true } 
            },
			formatter : function(value, row, index) {
				if(row.serviceState == 200){
					return row.serviceState;
				}else{
					return  "<div style=\"width: 560px;margin:0 auto;border:red 0px solid;display:block;word-break: break-all;word-wrap: break-word;color:red \">"+row.serviceState+"</div>";
				}
				
			}
		}
		] ],
		rownumbers: true,
		onLoadSuccess: function(data){
			
		}/*,onDblClickRow: function (rowIndex,rowData) {
            //alert("出发双击事件");
			$("#datagrid").datagrid("beginEdit", rowIndex);
	        //$("#datagrid").datagrid('endEdit',rowIndex);
	        //$("#datagrid").datagrid('beginEdit',rowIndex);
	        //$('#datagrid').datagrid('selectRow',rowIndex);
        }*/
	});
}