checkpad っぽい In-Place-Edit を作る
クライアントサイドなので答えを見ようとおもえば見れるんですが,挙動からコードを推測する遊びとして。もちろん script.aculo.us の Ajac.InPlaceEditor ベースです。
var CheckPadIPE = Class.create();
Object.extend(CheckPadIPE.prototype, Ajax.InPlaceEditor.prototype);
Object.extend(CheckPadIPE.prototype, {
initialize: function(element, url, options) {
var mydefault = Object.extend({
okText: '更新',
cancelText: '[キャンセル]',
savingText: '',
clickToEditText: ''
}, options || {});
Ajax.InPlaceEditor.prototype.initialize.call(this, element, url, mydefault);
if (this.options.externalControl)
Event.stopObserving(this.element, 'click', this.onclickListener);
},
onclickCancel: function() {
this.leaveEditMode();
return false;
},
enterHover: function() {},
leaveHover: function() {}
});いまいちスーパークラスをどう扱えばいいかわかりませんでした。
結局 Event.stopObserving を使うのなら enterHover, leaveHover を再定義せずにそっちも stopObserving しろという感じですね。ほかいろいろ稚拙ですが許してください。