ckeditor的Js文件无法加载到codeigniter中

时间:2012-08-28 10:49:24

标签: php javascript codeigniter ckeditor

我正在尝试将ck编辑器集成到我的管理部分。我将ck编辑器文件夹放入我的资源文件夹。这是代码

<script type="text/javascript" src="<?php echo base_url(); ?>assets/admin/ckeditor/ckeditor.js"></script>

之后我为helper创建了一个代码。这是代码

<?php
if(!defined('BASEPATH')) exit('No direct script access allowed');

/*
 * CKEditor helper for CodeIgniter
 * 
 * @author Samuel Sanchez <samuel.sanchez.work@gmail.com> - http://kromack.com/
 * @package CodeIgniter
 * @license http://creativecommons.org/licenses/by-nc-sa/3.0/us/
 * @tutorial http://kromack.com/developpement-php/codeigniter/ckeditor-helper-for-codeigniter/
 * @see http://codeigniter.com/forums/viewthread/127374/
 * @version 2010-08-28
 * 
 */

/**
 * This function adds once the CKEditor's config vars
 * @author Samuel Sanchez 
 * @access private
 * @param array $data (default: array())
 * @return string
 */
function cke_initialize($data = array()) {

    $return = '';

    if(!defined('CI_CKEDITOR_HELPER_LOADED')) {

        define('CI_CKEDITOR_HELPER_LOADED', TRUE);
        $return =  '<script type="text/javascript" src="'.base_url(). $data['path'] . '/ckeditor.js"></script>';
        $return .=  "<script type=\"text/javascript\">CKEDITOR_BASEPATH = '" . base_url() . $data['path'] . "/';</script>";
    } 

    return $return;

}

/**
 * This function create JavaScript instances of CKEditor
 * @author Samuel Sanchez 
 * @access private
 * @param array $data (default: array())
 * @return string
 */
function cke_create_instance($data = array()) {

    $return = "<script type=\"text/javascript\">
        CKEDITOR.replace('" . $data['id'] . "', {";

            //Adding config values
            if(isset($data['config'])) {
                foreach($data['config'] as $k=>$v) {

                    // Support for extra config parameters
                    if (is_array($v)) {
                        $return .= $k . " : [";
                        $return .= config_data($v);
                        $return .= "]";

                    }
                    else {
                        $return .= $k . " : '" . $v . "'";
                    }

                    if($k !== end(array_keys($data['config']))) {
                        $return .= ",";
                    }                       
                } 
            }               

    $return .= '});</script>';  

    return $return;

}

/**
 * This function displays an instance of CKEditor inside a view
 * @author Samuel Sanchez 
 * @access public
 * @param array $data (default: array())
 * @return string
 */
function display_ckeditor($data = array())
{
    // Initialization
    $return = cke_initialize($data);

    // Creating a Ckeditor instance
    $return .= cke_create_instance($data);


    // Adding styles values
    if(isset($data['styles'])) {

        $return .= "<script type=\"text/javascript\">CKEDITOR.addStylesSet( 'my_styles_" . $data['id'] . "', [";


        foreach($data['styles'] as $k=>$v) {

            $return .= "{ name : '" . $k . "', element : '" . $v['element'] . "', styles : { ";

            if(isset($v['styles'])) {
                foreach($v['styles'] as $k2=>$v2) {

                    $return .= "'" . $k2 . "' : '" . $v2 . "'";

                    if($k2 !== end(array_keys($v['styles']))) {
                         $return .= ",";
                    }
                } 
            } 

            $return .= '} }';

            if($k !== end(array_keys($data['styles']))) {
                $return .= ',';
            }           


        } 

        $return .= ']);';

        $return .= "CKEDITOR.instances['" . $data['id'] . "'].config.stylesCombo_stylesSet = 'my_styles_" . $data['id'] . "';
        </script>";     
    }   

    return $return;
}

/**
 * config_data function.
 * This function look for extra config data
 *
 * @author ronan
 * @link http://kromack.com/developpement-php/codeigniter/ckeditor-helper-for-codeigniter/comment-page-5/#comment-545
 * @access public
 * @param array $data. (default: array())
 * @return String
 */
function config_data($data = array())
{
    $return = '';
    foreach ($data as $key)
    {
        if (is_array($key)) {
            $return .= "[";
            foreach ($key as $string) {
                $return .= "'" . $string . "'";
                if ($string != end(array_values($key))) $return .= ",";
            }
            $return .= "]";
        }
        else {
            $return .= "'".$key."'";
        }
        if ($key != end(array_values($data))) $return .= ",";

    }
    return $return;
}

现在这是我的控制器代码:

public $data    =   array();

public function __construct() {

    //parent::Controller();
     parent::__construct(); 

    $this->load->helper('url'); //You should autoload this one ;)
    $this->load->helper('ckeditor');


    //Ckeditor's configuration
    $this->data['ckeditor'] = array(

        //ID of the textarea that will be replaced
        'id'    =>  'content',
        'path'  =>  base_url().'assets/admin/js/ckeditor',

        //Optionnal values
        'config' => array(
            'toolbar'   =>  "Full",     //Using the Full toolbar
            'width'     =>  "550px",    //Setting a custom width
            'height'    =>  '100px',    //Setting a custom height

        ),

        //Replacing styles from the "Styles tool"
        'styles' => array(

            //Creating a new style named "style 1"
            'style 1' => array (
                'name'      =>  'Blue Title',
                'element'   =>  'h2',
                'styles' => array(
                    'color'     =>  'Blue',
                    'font-weight'   =>  'bold'
                )
            ),

            //Creating a new style named "style 2"
            'style 2' => array (
                'name'  =>  'Red Title',
                'element'   =>  'h2',
                'styles' => array(
                    'color'         =>  'Red',
                    'font-weight'       =>  'bold',
                    'text-decoration'   =>  'underline'
                )
            )               
        )
    );

    $this->data['ckeditor_2'] = array(

        //ID of the textarea that will be replaced
        'id'    =>  'content_2',
        'path'  =>  'js/ckeditor',

        //Optionnal values
        'config' => array(
            'width'     =>  "550px",    //Setting a custom width
            'height'    =>  '100px',    //Setting a custom height
            'toolbar'   =>  array(  //Setting a custom toolbar
                array('Bold', 'Italic'),
                array('Underline', 'Strike', 'FontSize'),
                array('Smiley'),
                '/'
            )
        ),

        //Replacing styles from the "Styles tool"
        'styles' => array(

            //Creating a new style named "style 1"
            'style 3' => array (
                'name'      =>  'Green Title',
                'element'   =>  'h3',
                'styles' => array(
                    'color'     =>  'Green',
                    'font-weight'   =>  'bold'
                )
            )

        )
    );      


}

这是我的观看代码:

<textarea name="content" id="content" ><p>Example data</p></textarea>
<?php echo display_ckeditor($ckeditor); ?>

但我的ckeditor.js无法加载,请帮助我或给我合适的步骤,将ck编辑器集成到codeigniter中。

1 个答案:

答案 0 :(得分:0)

我得到了我自己的问题的答案。 要在codeignitor中安装ck编辑器,您只需按照以下步骤操作: - 1.在资产(或你想要的)中输入ck编辑器文件夹。并给出js文件的正确路径。 2.现在在您的视图部分中只包含js文件:

<script type="text/javascript" src="<?php echo base_url(); ?>assets/admin/ckeditor/ckeditor.js"></script>

3.现在在同一个文件中输入此代码: -

<textarea class="ckeditor" name="editor1"></textarea>

4.现在您可以在浏览器上看到编辑器。