easyUi 的datagrid可编辑表格中需要为一列增加字数输入限制,由于没有找到该插件的 editor 中有自定义函数的api,所以,只能自己在onClickRow中实现了,实现方法也挺简单的,在onClickRow中添加自定义函数即可。
//增加完成情况字数输入限制
$('#workloadTable').datagrid('beginEdit', rowIndex);
var ed = $('#workloadTable').datagrid('getEditors', rowIndex);
for (var i = 0; i < ed.length; i++)
{
var e = ed[i];
$(e.target).bind("keyup",function()
{
return countChar($(this));
}).bind("change", function()
{
return countChar($(this));
});
}
其中 workloadTable 是table的id,countChar 是字符验证函数,代码如下:
/**
* 输入框字数提示和fix
* @param textarea
*/
function countChar(textarea)
{
var currentWords = $(textarea).val().length;
if (currentWords > maxWords)
{
alert('最多只能输入'+maxWords+'个字符!');
$(textarea).val($(textarea).val().substr(0, maxWords));
return false;
}
}
但是,这是为所有的Editors 都添加了字符验证方法,如果需要指定到某列,可以尝试以下方法:
通过调试我们可以看到:我们遍历的editor 列表 var e = ed[i] 中,每个editor 有如下属性:
因此,我们想要只绑定某一列,则做个判断即可:
例如:加上 if(e.field == "description") ,表明只给 description 列 bind 字符限制方法,部分代码:
onClickRow:function(rowIndex, rowData){
if (lastIndex != rowIndex){
$('#workloadTable').datagrid('endEdit', lastIndex);
$('#workloadTable').datagrid('beginEdit', rowIndex);
}
//增加完成情况字数输入限制
$('#workloadTable').datagrid('beginEdit', rowIndex);
var ed = $('#workloadTable').datagrid('getEditors', rowIndex);
for (var i = 0; i < ed.length; i++)
{
var e = ed[i];
alert(e.field);
if(e.field == "description")
{
$(e.target).bind("keyup",function()
{
return countChar($(this));
}).bind("change", function()
{
return countChar($(this));
});
}
}
setEditing(rowIndex, rowData);
lastIndex = rowIndex;
}
最后,editor 自定义事件已经绑定完成。
方法2:http://blog.csdn.net/tianlincao/article/details/7531617