我目前正在使用jEditable插件来编写可更新的文本。我的服务器端是使用Struts2开发的,我调用的服务器URL是返回JSON结果的struts操作。我使用以下代码将jeditable加载到我的字段(这是H1):
$("h1.myclass").editable("/MyApp/dinamic/updateText.action", {
indicator : "<center><img src='/MyApp/images/loading.gif'></center>",
submit : 'Save',
cancel : 'Cancel',
tooltip : "Click to edit",
onblur : "ignore",
name : "myField",
callback : function(value, settings) {
alert(JSON.stringify(value));
}
});
正如您所看到的,在此代码中我还没有使用type : autogrow
功能,到目前为止工作正常。问题是,当我添加type : autogrow
时,会显示相应的文本,但是当我单击“保存”按钮时,浏览器会重定向到类似
http://localhost:8080/MyApp/myform.action?myfield=YadaYada
其中YadaYada
是我尝试保存的实际文本,而myform.action
是我已经存在的页面。
有没有人知道为什么会出现这个错误? \
OBS :我也尝试使用growfield2而不是自动增长,结果是一样的。
答案 0 :(得分:0)
好的,所以我不能完全确定我是否正确,但我一直在努力解决这个问题。我发现如果某些代码“略微”关闭,那么它将导致页面重新路由。我已经让autogrow工作了,我相信这对你有用:
$.editable.addInputType('autogrow', {
element: function (settings, original) {
var textarea = $('<textarea />');
if (settings.rows) {
textarea.attr('rows', settings.rows);
} else {
textarea.height(settings.height);
}
if (settings.cols) {
textarea.attr('cols', settings.cols);
} else {
textarea.width(settings.width);
}
$(this).append(textarea);
return (textarea);
},
plugin: function (settings, original) {
$('textarea', this).autogrow(settings.autogrow);
}
});
$("h1.myclass").editable("/MyApp/dinamic/updateText.action", {
type: "autogrow",
indicator: "<center><img src='/MyApp/images/loading.gif'></center>",
submit: 'Save',
cancel: 'Cancel',
tooltip: "Click to edit",
onblur: "ignore",
name: "myField",
callback: function (value, settings) {
alert(JSON.stringify(value));
},
autogrow: {
lineHeight: 16,
maxHeight: 512
}
});