デザイナーが HTML5 デザインを提出し、ユーザーが独自のコンテンツを追加できるようにするテンプレート システムをセットアップしています。アプリには CKEditor 4.2 と Rails 3 を使用しています。ユーザーがテンプレート ページを読み込んで、さまざまなインライン エディターを直接編集し、JS と Ajax 経由で保存できるようにしたいと考えています。すべてが機能していましたが、iFrame プラグインを追加すると、インライン エディターからテンプレートに未加工の HTML を保存しただけだったため、書式設定の問題が発生しました。詳細については、この質問を参照してください: CKEditor and iFrame/YouTube/Other Embed Plugins Show Weird HTML Code
次のようなものを使用する必要があることがわかりました。
var data = CKEDITOR.instances.editable.getData();
しかし、このように複数のエディターを管理するにはどうすればよいでしょうか? 私はデザイナーに単に使用するように言いました
contenteditable="true"
編集可能にしたいすべてのdivに対して。したがって、各エディターを参照する ID がなく、各テンプレート ファイルに含まれるエディターの数もわかりません。編集不可能なコンテンツともちろん編集可能なコンテンツの両方を最終的なテンプレートに保存できるようにしたいと考えています。 HTML5 ページ。
ID付きのdivを使用して、テンプレートファイル全体の生の内容を保存する必要があった解決策は次のとおりです。
$saveButton.click(function(e) {
// Extract contents of magboy container
var contents = $("#page-cnt").html();
// Send contents to server
$.ajax({
url: '/pages/'+PageId+'/editor_save',
type: 'POST',
data: {
containerContents: contents
},
success: function(response){
alert("contents saved");
}
});
// prevent original click behaviour
e.preventDefault();
return false;
});
だから私の質問を要約すると:
複数の CKEditor エディターのコンテンツを完全なテンプレート ページに保存する保存機能を実装するにはどうすればよいですか?
ご協力いただきありがとうございます。この質問にご協力いただければ、同じ質問にも答えていただけると思います: CKEditor で複数のインライン編集を保存する