4

新しいCKEditor4（ http://docs.ckeditor.com/#!/guide/dev_inline-section-2 ）の「インライン編集」を使用したいのですが、PHPでデータを保存する方法の例が見つかりません。 /MySQL。手伝って頂けますか？

4

4 に答える 4

7

AJAXの魔法が必要です。ページ内のJavaScriptを介して、編集されたHTMLを取得します。次に、それをサーバーに送信し、そこでPHPスクリプトがそれを取得して、MySQLに渡すことができます。

これがロープを示す簡単なテストケースです。

編集可能なHTMLから始めましょう。

<div id='textToBeSaved' contenteditable='true'>
    <p>Using the <strong>Terminal</strong> in OS X makes you all-powerful.</p>
</div>

POSTイベントを開始するために使用される「保存」ボタンも必要です。

<button onclick='ClickToSave()'>Save</button>

このようなボタンは、CKEditorツールバー自体に配置することもできますが、コーディングが必要になるため、JavaScriptが得意な人に任せます。

もちろん、CKEditorを含めたいと思います。サンプルコードでは、結果のAJAX化に使用するjQueryも使用します。

<script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript' src='CKEditor4/ckeditor.js'></script>

これで、「保存」ボタンを押したときに実行されるスクリプトが表示されます。CKeditorを使用して編集されたHTMLを取得し、次にjQueryを使用して送信します。

<script type='text/javascript' language='javascript'>
// <![CDATA[
function ClickToSave () {
    var data = CKEDITOR.instances.textToBeSaved.getData();
    $.post('save.php', {
        content : data
        })
    }
// ]]>

これで、クライアント側に他に何も必要ありません。

サーバーには、スクリプトが更新されたHTMLをPOSTするときに機能するPHPコードが必要です。スクリプトはsave.phpと呼ばれ、コードを逐語的に使用する場合はHTMLと同じディレクトリに配置する必要があります。ここでの私のワンライナーは、HTMLを/tmpフォルダー内の一時ファイルに保存するだけです。代わりに、MySQLの魔法を自由に追加してください。

<?php
file_put_contents('/tmp/serverside.html', $_POST['content']);
?>
于 2012-12-03T20:23:27.697 に答える
4

これは私が過去に行った方法です：

はcurrent_page_id、更新したいテーブル行に関連しています。そうしないと、どのレコードを更新する必要があるかわかりません。

<div id="editable">My body text</div>
<input type="hidden" name="page_id" id="current_page_id" value="10" />

<script type="text/javascript">

CKEDITOR.disableAutoInline = true;
CKEDITOR.inline('editable', {
    on: {
        blur: function( event ) {

            var params = {
                page_id: $("#current_page_id").val(),
                body_text: event.editor.getData()
            };

            $.ajax({
                url: 'php_file_to_post_to.php',
                global: false,
                type: "POST",
                dataType: "text json",
                data: params,
                success: function(result) {
                    console.log(result);
                }
            });

        }
    }
});

</script>

PHP ファイルの内部では、php_file_to_post_to.php単に ajax ポスト リクエストをキャッチpage_idし、編集されたコンテンツとともにポストされた変数に基づいて行を更新します。

于 2013-03-26T14:03:44.273 に答える
2

これは、テキストエリアデータを取得する方法です

CKEDITOR.instances.editor1.getData()

CKEDITOR機能を作成するために使用したオブジェクトに他なりません。

于 2013-01-10T10:46:35.670 に答える
-1

コードをどうもありがとう。file_put_contents('page.php', stripslashes ($_POST['content']));でコードを改善してみてください。div にonBlur="ClickToSave()"を追加すると、保存ボタンを削除できるようになりました。

于 2013-01-10T10:43:26.380 に答える