आपको कुछ AJAX जादू चाहिए। पृष्ठ के अंदर जावास्क्रिप्ट के माध्यम से आपको संपादित 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 टूलबार में ही रख सकते हैं, लेकिन इसके लिए अधिक कोडिंग की आवश्यकता होगी और मैं इसे किसी ऐसे व्यक्ति पर छोड़ दूंगा जो मुझसे बेहतर जावास्क्रिप्ट में है।
बेशक आप CKEditor को शामिल करना चाहते हैं। अपने नमूना कोड के लिए मैं jQuery का भी उपयोग करूँगा, जिसका उपयोग मैं परिणामों को AJAX करने के लिए करूँगा।
<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>
अब स्क्रिप्ट जो "सहेजें" बटन दबाने पर निष्पादित होगी। यह संपादित HTML को हथियाने के लिए CKeditor का उपयोग करेगा, फिर इसे भेजने के लिए jQuery का।
<script type='text/javascript' language='javascript'>
// <![CDATA[
function ClickToSave () {
var data = CKEDITOR.instances.textToBeSaved.getData();
$.post('save.php', {
content : data
})
}
// ]]>
बस इतना ही, आपको क्लाइंटसाइड के अलावा किसी और चीज की जरूरत नहीं है।
सर्वर पर, आपके पास PHP कोड होना चाहिए जो स्क्रिप्ट द्वारा अपडेट किए गए HTML को पोस्ट करने पर कार्य करेगा। स्क्रिप्ट को save.php कहा जाना चाहिए और उसी निर्देशिका में स्थित होना चाहिए जहां HTML है यदि आप मेरे कोड शब्दशः का उपयोग करते हैं। यहां मेरा एक-लाइनर आपके HTML को /tmp फ़ोल्डर के अंदर एक अस्थायी फ़ाइल में सहेज लेगा। इसके बजाय बेझिझक अपना MySQL जादू जोड़ें।
<?php
file_put_contents('/tmp/serverside.html', $_POST['content']);
?>