FCKEditor detects submit after YUI

I am using FCKEditor in a form that is submitted using AJAX, more specifically using the connection module that can be found in YUI (The Yahoo! User Interface Library). I have hooked to the submit event of my form using the event module in YUI. My problem is that FCKEditor doesn't seem to be able to detect when my form is about to be submitted, and so it does not update the value of the linked field in time. I have noticed that it does update the field after the form has been submitted. This leads me to the conclusion it is able to detect the submit event but not before YUI detects it. I have been able to remedy this problem by manually calling FCKeditorAPI.GetInstance(instanceId).UpdateLinkedField() from my submit event handler but I feel this is a somewhat dirty. I wonder if other people experience this or a similar problem and if you have found some other solution?
/Robert Kajic

Sat, 08/16/2008 - 15:01

alikayahan

Joined: 16/08/2008

Posts: 1

Re: FCKEditor detects submit after YUI

Thats what i exprience during posting FCKeditored textarea with jquery $.post ,any solutions ?

Fri, 08/29/2008 - 01:01

dizzyjay

Joined: 02/04/2008

Posts: 2

Re: FCKEditor detects submit after YUI

Any luck with this? (having the same issue)

Fri, 09/12/2008 - 16:56

dougal2

Joined: 12/09/2008

Posts: 4

Re: FCKEditor detects submit after YUI

$(form_element + ' form').ajaxForm({
   target: form_element
   beforeSubmit: function(formArray, jqForm){
      // if any FCKEditors open, update their fields
      if (FCKeditorAPI)
      {
         for (i in FCKeditorAPI.Instances)
         {
            // TODO fix this, it doesn't work.
            if (FCKeditorAPI.Instances[i].IsDirty())
               FCKeditorAPI.Instances[i].UpdateLinkedField();
         }
         delete i;
      }
      
      return true;
   },
   success: function(data){
      // my success routine
   }
});

Wed, 02/04/2009 - 16:20

veres

Joined: 04/02/2009

Posts: 1

Re: FCKEditor detects submit after YUI

Used jquery.js + jquery.forms.js

jquery forms plugin create a new event "form-pre-serialize" using this you can resolve the problem like this:



$(document).ready(function() {
   var options = {
       data:          {overwriten_is_ajax_post: '1'},   // some additional post data
        target:        '#output1',   // target element(s) to be updated with server response        
        beforeSubmit:  showRequest,  // pre-submit callback
        success:       showResponse,  // post-submit callback
        error:         showError
    };


  // bind form using 'ajaxForm'
     $('#fform3').ajaxForm(options);


//
    // bind 'form-pre-serialize' if you need to take action before the data
    // is extracted from the form.  for example, if you use a rich editor component
    // such as TinyMCE you can use this hook to invoke tinyMCE.triggerSave();
    //
    $('form').bind('form-pre-serialize', function(event, $form, formOptions, veto) {
           // $form and formOptions are the same args passed to the 'beforeSubmit' handler

        // the veto object is used to communicate information back to the form plugin

        // to cancel the submit do this:
        //veto.veto = true;
         //// !!!! MF update all instances of FCKeditor before submit
   if (typeof(FCKeditorAPI) == "object"){
      for ( var fckname in FCKeditorAPI.Instances )
               {
                        FCKeditorAPI.GetInstance(fckname).UpdateLinkedField();
                        FCKeditorAPI.GetInstance(fckname).Events.FireEvent( 'OnAfterLinkedFieldUpdate' );
            }
        }


    });

});

Works 100%