CLEditor in Jquery modal dialog

[John V]

I wanted to replace another editor in our project with CLEditor, but running into a problem (an MVC4 project for whatever that's worth). 

My page has a table of comments each with a single response. If you click the edit link on a row in that table, it opens a modal jquery dialog and you can edit the comment and response which are both text area controls, but the comment field uses the CLEditor.

It nearly works perfectly. However, if the user clicks the dialog's [X] to close rather than clicking the "Save" (submit) button, then the next time the dialog is opened the CLEditor control has only "true" in the edit field text, not the actual text that that textarea was bound to.

Additional details: 

• I call $('#Comment').cleditor() only the first time the dialog is opened.  
  
• If you're familiar with jquery dialogs, the dialog is just a div on the main page that is rendered from an MVC partial view. Clicking the "Edit" link mentioned above triggers a call to $.getJSON() and then binds the form to the returned JSON data. 
  
• jquery version is 2.1.0
• jquery UI version 1.10.4

Would be grateful for any advice. So close, yet so far!

[John V]

CLEditor version 1.4.5

[John V]

Couple more details: 

• The submit button ends up causing a reload of the page, so you would expect that to be fine.  The [X] button just closes (hides) the dialog so there's some state getting screwed up somewhere.
  
• When the problem occurs, the editor control is also disabled. It cannot receive focus.

[Chris Landowski]

You might want to try the .refresh() and/or .updateFrame() methods after the dialog is opened:

http://premiumsoftware.net/cleditor/gettingstarted

--
You received this message because you are subscribed to the Google Groups "cleditor" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cleditor+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[John V]

I finally found an old post that said I had to call refresh.  My dialog opens with an animation, so the code had to be called when the animation was complete (i.e. the dialog was finished opening).  This code worked:

 

            $("#editCommentDiv").dialog({

                autoOpen: false,

                modal: true,

                draggable: true,

                resizable: false,

                width: 650,

                title: "Edit Comment/Response",

                show: {

                    effect: "slide",

                    duration: 400

                },

                hide: {

                    effect: "slide",

                    duration: 400

                },

                open: function () {

                    $(this).parent().promise().done(function () {

                        if (!ckinit) {

                            $('#Comment').cleditor();

                            ckinit = true;

                        }

                        else {

                            $('#Comment').cleditor()[0].refresh();

                        }

                    });

                }

            });