1

I am using nicEdit to add rich text editing to a textarea. I am using the Codeigniter MVC framework and jQuery to make a simple AJAX call to create a new textarea then applying nicEdit to this new textarea once it's returned from the AJAX call. Everything works as expected and the nicEdit is instantiated as expected using the following code:

<html>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="<? echo base_url();?>assets/js/nicEdit.js"></script>

<body>
<div id="area1"></div>
<input id="submit" type="submit" value="submit" />

<script>
$(document).ready(function() {

    $('#submit').click(function(){
        $.ajax
        ({
            type: "POST",
            url: "test/ajax",
            success: function(html)
            {
                $('#area1').html(html);
                new nicEditor().panelInstance('newArea');
            }
        });
    });
});
</script>

</body>
</html>

The test/ajax controller being called from the submit button click event is a function that returns a new textarea as follows:

    function ajax()
    {
        echo "<textarea id='newArea'></textarea>";
    }

In my main application, I am conceptually doing the same thing as described above, namely returning a new textarea from an AJAX call, then instantiating this new area on the AJAX success function. The problem I am having is that although nicEdit hooks onto this new textarea from the AJAX call, the nicEdit icons do not appear. The font format, font family and font size attributes are displayed and work, but none of the other icons (bold, italic, underline, etc.) are displayed.

Suggestions are appreciated.

1 Answer 1

1

I think you need to explicity specify where the icons file is located. You can do this passing a configuration dictionary when instantiating the nicEditor object: NicEdit Configuration Options

1
  • You are absolutely correct. All I had to do was pass the location to the iconsPath and everything works as expected. Strange that I didn't have to do that in my prototype but lesson learned! Thanks again! new nicEditor({fullPanel : true, iconsPath : baseurl+'assets/images/nicEditorIcons.gif', maxHeight : 200}).panelInstance('newArea');
    – Gunnar
    Aug 15, 2011 at 4:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.