ACEのエディターインスタンスをHTMLエレメントから再取得する

(Comments)

Django-ACE で ACE を使ってて、Ctrl + S ( Command + S )で保存のショートカットキーを使いたかった。

Django-ACE は、 widget.js で 

editor = ace.edit(div)

こんな感じで、editor インスタンスを作ってるけど、function内のローカル変数なので function外からはアクセスできない。

そんな時は、div.env.editor に参照があるのでアクセスできる。

Django Admin で ACE を使っている場合、editor への参照へのアクセスを jQuery で書くと

$('div.django-ace-widget')[0].firstChild.env.editor

こんな感じ。

Ctrl + S ( Command + S ) のショートカットをバインドするには

$('div.django-ace-widget')[0].firstChild.env.editor.commands.addCommand({
Name : "save",
bindKey: {
win : "Ctrl-S",
mac : "Command-S"
},
exec: function(editor) {
alert('Save!');
}
});

このように書ける。

Django の Admin 用 JS にするとこんな

// Admin ACE Save
$(function () {
setTimeout(function () {
var aces = $('div.django-ace-widget');
if (!aces.length) {
return;
}
var editor = aces[0].firstChild.env.editor;
if (!editor) {
return;
}
var continueButton = $('input[type="submit"][name="_continue"]');
if (!continueButton.length) {
return;
}

editor.commands.addCommand({
Name: "save",
bindKey: {
win: "Ctrl-S",
mac: "Command-S"
},
exec: function (editor) {
continueButton.click();
}
});
}, 2000);
});

Currently unrated

Comments

Recent Tweets

  • 大坂昌彦

    大坂昌彦 @masahiko_osaka

    ytyng

    ついに犯人がわかってしまいました! ナル、一昨日にも僕だったので、昨日の人しかいません!! ペダルにガムテープ貼っても良いけど、剥がして帰って欲しい。散々、自分の足で踏みつけたガムテープを何で次の人が剥がさなきゃならないの??自分… https://t.co/Contz66ZK9
    4 days ago

  • ytyng

    ytyng @ytyng

    Shopify の在庫数更新API GraphQLの場合: 一括更新できる 絶対値更新できない REST API の場合: 一括更新できない 絶対値更新できる なんなのそれ https://t.co/0QyibNQXdt
    2 weeks, 6 days ago

  • ytyng

    ytyng @ytyng

    #bulma スペーシングヘルパー、マージされてる! もうこれBootstrapじゃん https://t.co/uI8fZ6lAOw
    2 weeks, 6 days ago

Recent Posts

Archive

2020
2019
2018
2017
2016
2015
2014
2013
2012
2011

Categories

Authors

Feeds

RSS / Atom