我正在使用Jquery JTable,如果我们将字段类型设置为textarea,它会在编辑和创建表单中加载文本区域而不是输入。
我想把那个textarea变成一个WYSIWYG Edior。 我试过但它不起作用。 甚至尝试使用http://jtable.org/ApiReference#fopt-input但它不起作用。
请告诉我怎么做。
答案 0 :(得分:0)
根据您的要求。
Name: {
title: 'Name',
width: '20%',
input: function (data) {
if (data.record) {
return '<textarea cols="30" id="Name" name="Name" rows="5" wrap="hard">' + data.record.Name+ '</textarea>';
} else {
return '<textarea cols="30" rows="5" wrap="hard" name="Name"/>';
}
}
}
}
答案 1 :(得分:0)
下载tinymce(http://www.tinymce.com/)并将相应的JS / CSS文件添加到您的项目中。
这是您需要的JTable代码:
$('#JTableContainer').jtable({
title: 'My Table',
actions: {
listAction: '/MyAction/List',
createAction: '/MyAction/Add',
updateAction: '/MyAction/Edit',
deleteAction: '/MyAction/Delete'
},
fields: {
TableID: {
key: true,
list: false
},
MyTextArea: {
title: 'Fill out this form',
type: 'textarea'
},
},
formCreated: function (event, data) {
tinymce.init({
selector: 'textarea',
theme: 'modern',
toolbar: 'undo redo | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link unlink | cut copy paste | forecolor backcolor',
menubar: false,
statusbar: false
});
}
});
$('#JTableContainer').jtable('load');
答案 2 :(得分:0)
经过测试,似乎this solution解决了TinyMCE没有保存到textarea的问题(原因 - jtable中的提交事件超载)。此外,this solution在jTable关闭并重新打开编辑窗格时卸载并重新加载TinyMCE。
把它们放在一起 - 这对我有用:
formCreated: function (event, data) {
tinymce.init({
selector: 'textarea',
setup: function (editor) {
editor.on('change', function () {
editor.save();
});
}
});
for (var editor_id in tinyMCE.editors) {
tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1');
tinymce.EditorManager.execCommand('mceAddControl', true, editor_id);
tinymce.EditorManager.execCommand('mceAddEditor', true, editor_id);
}
},
formClosed: function (event, data) {
for (var editor_id in tinyMCE.editors) {
tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1');
tinymce.EditorManager.execCommand('mceRemoveControl', true, editor_id);
tinymce.EditorManager.execCommand('mceRemoveEditor', true, editor_id);
}
}