Search code examples
phpimageimage-uploadingnicedit

NicEdit Picture uploaded but shows blank image in editor

I have a problem regarding the nicEditor for textarea.

When i upload image in niceeditor from local storage image will be uploaded to folder and also database but doesen't showing in textarea. enter image description here

As you can see in image text editor shows blank image. my code is as follow.

  var nicUploadOptions = {
        buttons : {
            'upload' : {name : 'Upload Image', type : 'nicUploadButton'}
        }

    };
    var nicUploadButton=nicEditorAdvancedButton.extend({nicURI:"image.php" and more..
    nicEditors.registerPlugin(nicPlugin,nicUploadOptions);

And PHP Code is as follow 

<?php
//Check if we are getting the image
if(isset($_FILES['image'])){
        //Get the image array of details
        $img = $_FILES['image'];       
        //The new path of the uploaded image, rand is just used for the sake of it
        $path = "upload/" . rand().$img["name"];
        //Move the file to our new path
        move_uploaded_file($img['tmp_name'],$path);
        //Get image info, reuiqred to biuld the JSON object
        $data = getimagesize($path);
        //The direct link to the uploaded image, this might varyu depending on your script location    
        $link = "http://$_SERVER[HTTP_HOST]"."/nicedit/".$path;
        //Here we are constructing the JSON Object
        $res = array("data" => array( "link" => $link, "width" => $data[0], "height" => $data[1]));
        //echo out the response :)
        echo json_encode($res);
}
?>

Image will be successfully upload to folder and database.

Solution

  • Find the Following Sollution 

     line starting with nicURI:"http://api.imgur.com/2/upload.json" 
    Replace with

    nicURI:"image.php"

    And PHP Code is 

    <?php
//Check if we are getting the image
if(isset($_FILES['image'])){
        //Get the image array of details
        $img = $_FILES['image'];       
        //The new path of the uploaded image, rand is just used for the sake of it
        $path = "upload/" . rand().$img["name"];
        //Move the file to our new path
        move_uploaded_file($img['tmp_name'],$path);
        //Get image info, reuiqred to biuld the JSON object
        $data = getimagesize($path);
        //The direct link to the uploaded image, this might varyu depending on your script location    
        $link = "http://$_SERVER[HTTP_HOST]"."/nicedit/".$path;
        //Here we are constructing the JSON Object
         $res = array("data" => array( "link" => $link, "width" => $data[0], "height" => $data[1]));                          
                    ));
        //echo out the response :)
        echo json_encode($res);
}
?>

    DONE ! Now i try uploading something and it would go directly to your server

    I reffer http://manzzup.blogspot.com.br/2014/03/customize-nicedit-image-upload-to.html .