1

とても基本的なアウトライン...

データベースから「投稿」を取得して、次のように表示しました。

<div class="blogtest">

    <form action="process/updatepost.php" class="updatepost" method="post">
        <input type="button" class='.$editenabled.' value="Edit">
        <input type="submit" class="saveupdatebutton" value="Save">
        <input type="hidden" class="postid" name="postid" value="'.$postID.'">

        <div class="text">

            <div class="buildtext">'.$text.'</div>

            <div class="editor"><textarea name="ckeditor"id="ckeditor" class="ckeditor">'.$text.'</textarea></div>

        </div>

    </form>

    </div>

編集ボタンをクリックすると、buildtext クラスが非表示になり、ckeditor が表示されます。編集ボタンと保存ボタンも同様です。

[保存] をクリックすると、ajax 呼び出しが行われ、データが更新されます。これは問題なく動作します...ただし、そのページにブログ投稿が 1 つしかない場合にのみ、問題なく動作します。

参照用の ajax は次のとおりです。

$(document).ready(function(){
$(".updatepost").submit(function(){
    var $targetForm = $(this);

    $targetForm.find(".error").remove();
    $targetForm.find(".success").remove();

    // If there is anything wrong with 
    // validation we set the check to false
    var check = true;

    // Get the value of the blog update post
    var $ckEditor = $targetForm.find('.ckeditor'),
        blogpost = $ckEditor.val();

            // Validation
    if (blogpost == '') {
        check = false;
       $ckEditor.after('<div class="error">Text Is Required</div>');
    }

      // ... goes after Validation
    if (check == true) {
    $.ajax({
    type: "POST",
    url: "process/updatepost.php",
    data: $targetForm.serialize(),
    dataType: "json",
    success: function(response){

    if (response.databaseSuccess)
       $targetForm.find(".error").remove();
    else
       $ckEditor.after('<div class="error">Something went wrong!</div>');

}
        });
    }
    return false;
});

});

そのため、ページに 2 つのブログ投稿があり、2 つ目 (最後の) 投稿を編集すると、[保存] をクリックすると投稿が正しく更新されます。

ただし、他のものを編集すると、データが送信されるまでに 2 回の送信が必要になります。

firebug を確認したところ、最初のクリックで古い値が送信され、2 回目のクリックで新しい値が送信されることがわかりました。

どこが間違っているのですか?

最終的に (一度機能すると)、投稿は ajax 呼び出しの成功時に更新されますが、今のところ、ユーザーが [保存] を 1 回クリックするだけでよいことが明らかに重要です。

助けてくれてありがとう!これ以上コードが必要な場合は、ここに投稿してください。

クレイグ:)

編集: ckeditor を通常のテキストエリアにした後、正常に動作します。テキストエリアとして文字通り機能しないことがわかっているので、ckeditorが更新されていないに違いありません。たぶん、別のリッチエディターを使用する必要があります...

4

2 に答える 2

3

同様の問題がありました。誰かが同じ問題でここにたどり着いた場合に備えて、私の経験を共有するだけです。CKEditor は、送信ボタンの最初のクリックでターゲット テキストエリアを更新していませんでした。テキスト エリアでデータ検証を行ったので、ありがたいことに、最初の送信でテキストエリアが入力されていないことに気付きました。これを克服するために、次のコードを追加します。

$('#accept-button').click(function (event) {
    for (var i in CKEDITOR.instances) {
        CKEDITOR.instances[i].updateElement();
    }
}
于 2014-09-26T10:58:45.717 に答える
1

統合ガイドからわかる限り、CKEditor はおそらく独自の onsubmit イベントを使用して、実際にデータをテキストエリアに送り返します。これは、これら 2 つのイベントが逆の順序で発生する可能性があることを意味します。最初にコードから古いテキストを取得し、次にテキストエリアを更新します。

次の構文を使用して、いつでも CKEditor のコンテンツを試して取得できます。

var editor_data = CKEDITOR.instances.yourInstance.getData(); 

また、CKEditor で jQuery アダプターを使用していますか?

編集:問題は、複数のテキストエリアで同じIDを持っているようで、すべて「ckeditor」と呼ばれています。ID は常にページに対して一意である必要があるため、これにより、ブラウザー間で予期しない動作が発生する可能性があります。

于 2013-09-26T19:13:37.697 に答える