Lưu dữ liệu vào PHP / Mysql với chỉnh sửa nội tuyến trong CKEditor

Bạn cần một số phép thuật AJAX. Thông qua JavaScript bên trong trang, bạn sẽ nhận được HTML đã chỉnh sửa. Sau đó, bạn gửi nó đến máy chủ, nơi một tập lệnh PHP lấy nó và có thể chuyển nó vào MySQL.

Đây là một trường hợp thử nghiệm đơn giản sẽ cho bạn thấy các dây.

Hãy bắt đầu với HTML có thể chỉnh sửa.

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

Chúng tôi cũng cần nút "Lưu" sẽ được sử dụng để bắt đầu sự kiện ĐĂNG.

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

Một nút như vậy có thể được chúng tôi định vị tốt trong chính thanh công cụ CKEditor, nhưng điều đó sẽ đòi hỏi nhiều mã hóa hơn và tôi sẽ để nó cho người giỏi JavaScript hơn tôi.

Tất nhiên bạn muốn bao gồm CKEditor. Đối với mã mẫu của tôi, tôi cũng sẽ sử dụng jQuery, mà tôi sẽ sử dụng để AJAXing kết quả.

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

Bây giờ tập lệnh sẽ thực thi khi bạn nhấn nút "Lưu". Nó sẽ sử dụng CKeditor để lấy HTML đã chỉnh sửa, sau đó jQuery để gửi nó.

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

Đây là nó, bạn không cần bất cứ điều gì khác bên cạnh khách hàng.

Trên máy chủ, bạn phải có mã PHP sẽ hoạt động khi tập lệnh ĐĂNG HTML cập nhật. Tập lệnh phải được gọi là save.php và được đặt trong cùng thư mục chứa HTML nếu bạn sử dụng nguyên văn mã của tôi. Một phần mềm của tôi ở đây sẽ chỉ lưu HTML của bạn trong một tệp tạm thời bên trong thư mục / tmp. Thay vào đó, hãy thêm phép thuật MySQL của bạn.

<?php
file_put_contents('/tmp/serverside.html', $_POST['content']);
?>