moving wym container after html update

[rvc]

it seems that after moving the element containing the wym instance, the instance is changed to it's initial values.
i'm building an 'edit-post' system...

here's what i have:

Code: Select all

var wymArray = new Object();

// just update the form values accordingly to the selected post
var update_form = function(form) {
   form.find('#op').val(op);
   form.find('#title').val(post.find('.title').html());
   form.find('#text').val(post.find('.text').html());
   form.find('#id').val(pid);
};

if (!form.exists())
{   // fetch edit_post form
   $.post(formgenerator, data, function(form_html)
   {
      form = $(form_html);
      update_form(form);
      form.find('textarea').wymeditor({ html: 'hi' });
      wymArray['edit_post'] = WYMeditor.INSTANCES.last(); // store instance
      post.replaceWith(form);
      // everything is fine here; the original text ("hi") is shown
   });
} else { // user tries to edit another post, and there is already a wym instance
   update_form(form);            
   var html = post.find('.text').html();
   var inst = wymArray['edit_post'];
   inst.html(html);   
   post.replaceWith(form);
   // stops working when i use/add the line above; instead of the post's text, it appears the constructor's html 'hi'  :shock:
}


any idea how to solve this?!

[mr_lundis]

Hi,
Does the whole editor stop working, or is it just the html content that doesn't match? If it's just the html I'd try to replace it after the move rather than before.

Cheers

[rvc]

ok, so i've managed to find that the problem is not the order of the html update and the container movement,
but the "timing" of the actually update. (edit: is just the html that doesn't match);

i have the whole code inside a click event (didn't think it was relevant), and using a 'thread sleep' function,
i can see that the html is updated only after the function ends... and can't really understand why

Code: Select all

var wymArray = new Object();

$(this).onclick(function()
{
   var form = $('#form_id');

   // just update the form values accordingly to the selected post
   var update_form = function(form) { ...(same as before)... }
     
   if (!form.exists())
   {   
      $.post(formgenerator, data, function(form_html)
      {
         ...(same as before)...
      });
   }
   else
   {
      update_form(form);           
      var html = post.find('.text').html();
      var inst = wymArray['edit_post'];
      inst.html(html);   
      // using 'thread.sleep(1000)' here the html was only update AFTER the time limit reached
   }
});
// using 'thread.sleep' here the html update happened before the sleep, so everything' was fine..


this means that, as the wym html is only updated when the click event finishes, i can't make it move and update (or vice-versa) within the click function.

i'm going to try some kung fu, see if i can get a way around it

btw, you thing there is another way (in the plugin code maybe?!) to update instantly the html?

[mr_lundis]

Do you think that you could set up a test page? Using the html-method is the most direct way of changing the html content, unless you want to append DOM nodes directly to the iframe's contentDocument. That delay doesn't rely make any sense.

[rvc]

here http://upshotokai.com/test.html

clicking edit the first time creates the form and the wym. this time the form is generated in the javascript.
clicking edit on the another post, changes the title instantly, and the html only after the sleep.
i think you can download everything if you want to test it in your machine.

and thanks a lot for looking

btw, interesting thing happens if you uncomment the last post.after(form) after the sleep; wym switches the html to the original text lol

[mr_lundis]

Okay, I've taken a look at the code on your website, and I still got no idea why the sleep function executes before the rest of the code finishes. I can't find any code for moving the editor on your example page either - wasn't that what you were trying to do in the first place?

[rvc]

it was commented.... it's after the sleep.
though it was irrelevant if the html is update in the end, but i uncommented now. could you then take another look please

[mr_lundis]

Sorry for the delayed reply, I've been kinda busy lately.

I'm guessing that It's the moving around part that's breaking the editor, the editor is in no way designed to be used in that manner. You could try moving the editor using css, or create a new instance for each post (and show/hide already initialized ones using css).

Cheers