Skip to main content

Implementation of CKEDITOR with javascript

Implementation of CKEDITOR with javascript

Html Portition
           
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>CKEditor</title>
        <!-- Make sure the path to CKEditor is correct. -->
        <script src="../ckeditor.js"></script>
    </head>
    <body>
        <form>
            <textarea name="editor1" id="editor1" rows="10" cols="80">
                This is my textarea to be replaced with CKEditor.
            </textarea>
        </form>
    </body>
</html>


Script Portition
<script>
    $(function(){
        CKEDITOR.replace( 'editor1', { // Here editor1 is id of textarea
            filebrowserUploadUrl: "../ckupload.php" // Controller Action
        });
     CKEDITOR.dtd.a.div = 1;
    });
</script>

ckupload.php
// filebrowserUploadUrl handing

    $url = WWW_ROOT.'images'. DS .'uploads'. DS .time()."_".$_FILES['upload']['name'];
    $default_url = Router::url('/', true).'app/webroot/images/uploads/'.time()."_".$_FILES['upload']['name'];
    //extensive suitability check before doing anything with the file…
    if(($_FILES['upload'] == "none") OR (empty($_FILES['upload']['name'])))
    {
       $message = "No file uploaded.";
    }
    elseif($_FILES['upload']["size"] == 0)
    {
       $message = "The file is of zero length.";
    }
    elseif(($_FILES['upload']["type"] != "image/pjpeg") AND ($_FILES['upload']["type"] != "image/jpeg") AND ($_FILES['upload']["type"] != "image/png"))
    {
       $message = "The image must be in either JPG or PNG format. Please upload a JPG or PNG instead.";
    }
    elseif(!is_uploaded_file($_FILES['upload']["tmp_name"]))
    {
       $message = "You may be attempting to hack our server. We're on to you; expect a knock on the door sometime soon.";
    }
    else{
        $message = "";
        if(move_uploaded_file($_FILES['upload']['tmp_name'], $url)) {
            chmod($url, 0755);
        } else{
            $message = "Error moving uploaded file. Check the script is granted Read/Write/Modify permissions.";
        }
    }
    $funcNum = $_GET['CKEditorFuncNum'] ;
    echo "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($funcNum, '$default_url', '$message');</script>";

Comments

  1. Thank you for posting helpful information about Implementation of CKEDITOR with javascript for PHP Development

    ReplyDelete
    Replies
    1. Thanks @Prajapati , if you need any PHP development help, let me know.

      Delete

Post a Comment

Popular posts from this blog

Generate XML file in Cakephp

Steps to Generate XML file using CakePHP: Step-1 Enable to parse xml extension in config route.php file.     Router::parseExtensions('xml'); Step-2 Add Request Handler Component to the Controller    var $components = array(‘RequestHandler’); Step-3 Add controller Action For XML Generation in Post Controller     function generateXMLFile()     {         if ($this->RequestHandler->isXml()) { // check request type             $this->layout = 'empty'; // create an empty layout in app/views/layouts/empty.ctp              }        }  Add header code in empty layout <?php header('Content-type: text/xml');?> <?php echo $this->Xml->header(); ?> <?php echo $content_for_layout; ?> Step-4 Set up View To generate XML Create xml folder inside Posts vi...

Simple JavaScript Object and Class Examples

In JavaScript, most things are objects. An object is a collection of related data and/or functionality Namespace: Everything you create in JavaScript is by default global. In JavaScript namespace is Global object . How to create a namespace in JavaScript? Create one global object, and all variables, methods, and functions become properties of that object. Example:  // global namespace var MYAPP = MYAPP || {}; Explaination: Here we first checked whether MYAPP is already defined.If yes, then use the existing MYAPP global object, otherwise create an empty object called MYAPP How to create sub namespaces? // sub namespace MYAPP.event = {}; Class JavaScript is a prototype-based language and contains no class statement.JavaScript classes create simple objects and deal with inheritance. Example: var Person = function () {}; Explaination: Here we define a new class called Person with an empty constructor. Use the class keyword class Calculation {}; A class expr...

How to Add Next Previous links to The Event Calendar

Add Next/Previous links to The Event Calendar Wordpress Plugin Add code to your child theme’s functions.php file /**  * Allows visitors to page forward/backwards in any direction within month view */ if ( class_exists( 'Tribe__Events__Main' ) ) { class ContinualMonthViewPagination {     public function __construct() {         add_filter( 'tribe_events_the_next_month_link', array( $this, 'next_month' ) );         add_filter( 'tribe_events_the_previous_month_link', array( $this, 'previous_month' ) );     }     public function next_month() {         $url = tribe_get_next_month_link();         $text = tribe_get_next_month_text();         $date = Tribe__Events__Main::instance()->nextMonth( tribe_get_month_view_date() );         return '<a data-month="' . $date . '" href="' . $url . '" rel="next"...