JQuery easyui datagrid 单元格编辑时,使用浮动的textarea文本框并进行数据校验

来源:互联网 发布:程序员必备 编辑:程序博客网 时间:2024/05/29 15:00

查看原文:http://www.ibloger.net/article/412.html


有两种方式实现,一种方式是在html中验证,一种方式是在js中进行验证


方式一:

 <th data-options="filed:'remark',width:200,editor:{type:'textarea'}">备注</th> 

方式二:

<th data-options="filed:'remark',width:200,editor:{type:'textarea', options:{validType:'maxLength[150]'}}">备注</th>

// 长度校验$.extend($.fn.validatebox.defaults.rules,{maxLength: {  validator: function(value, param){  if(value.length > param[0]){  return false;  }  return true;  },  message: "请输入的内容小于{0}个字符."  }})   // 解决datagrid中单击修改单元格时,textarea会自动将datagrid表格行撑大的问题$.extend($.fn.datagrid.defaults.editors,{textarea: {init: function(container, options){// var input = $("<textarea class='datagrid-editable-input' style='position:absolute; padding:0px; margin-top:-12px; height:120px; resize:none;' data-options=\"required:true,validType:'maxLength[10]'\"></textarea>").validatebox(options).appendTo(container);var input = $("<textarea class='datagrid-editable-input' style='position:absolute; padding:0px; margin-top:-12px; height:120px; resize:none;'></textarea>").validatebox(options).appendTo(container);  return input;  },getValue: function(target){  return $(target).val();},setValue: function(target, value){$(target).val(value);},resize: function(target, width){var input = $(target);   if($.boxModel == true){   input.width(width - (input.outerWidth() - input.width()));   }else{   input.width(width);}}}});



1 0