Manage CKEditor instances with persisting data and successfully loading editors on an html page through an Ajax call.

app-assets-javascripts-my401k-plan-sponsor-create-new-content-wizard.js

/*
updates form controls with the content of the editors
typically called just before persisting to the database
*/
function CKupdate(){
  if(typeof(CKEDITOR) != "undefined"){
    for ( instance in CKEDITOR.instances )
        CKEDITOR.instances[instance].updateElement();
  }
}

/*
ensures the memory is free for instantiating a new CKEditor instance
clears all CKEditor instances on the current page
resolves the 'i.contentWindow is null' error that comes up when Ajax 
navigating to a tab with CKEditor instances, away from, and back again
*/
function unloadCKEditor(){
  if(typeof(CKEDITOR) != "undefined"){
    for ( instance in CKEDITOR.instances ){
      console.log("removing instance: " + instance);
      CKEDITOR.instances[instance].destroy(true);
      //CKEDITOR.replace(instance);
    }
  }
}
...

/*
use Ajax to update data values for this wizard step
trigger CKEditor instances to serialize their values in
their respective html form elements
*/
function update_product(form, options){
  if(form == null){
    options.after_success();
    return false;
  }

  var href = $(form).attr("action");

  // syncronize CKEditor instances with associated form elements
  CKupdate();
  
  var jqxhr = $.post(href, form.serialize() + "&update_draft=", function(){}, "json")
...

/* 
handler for wizard when 'onTabShow' is triggered, typically 
a key press on 'Previous', 'Next', and breadcrumbs
first action is to free memory from all registered CKEditor 
instances (in CKEDITOR.instances)
*/
var handleOnTabShow = function(tab, navigation, index) {    
    unloadCKEditor();
...

/* 
register the wizard functionality
use 'after_success' to provide a callback that provides wizard behavior when successful
*/
$(document).ready(function() {
  $('#rootwizard').bootstrapWizard({onTabShow: function(tab, navigation, index){

    var form = $(".tab-pane.active").find("form").first();
    
    if(typeof(form[0]) != "undefined"){
      update_product(form, {
        after_success: function(){
          handleOnTabShow(tab, navigation, index);
...