Advanced Search

Drupal collapsible fieldset script with trigger to resize TinyMCE

/ Published in: JavaScript
Save to your folder(s)
This override function for the default Drupal.toggleFieldset function adds code that looks for instances of TinyMCE inside the fieldset and triggers the autoresize on them when the fieldset is opened. Otherwise TinyMCE renders with a weird height.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /**
  2.  * OVERWRITES Drupal.toggleFieldset in /misc/collapse.js
  3.  *
  4.  * Modified to trigger autoresize on tinyMCE textareas inside collapsed fieldsets
  5.  */
  6. Drupal.toggleFieldset = function(fieldset) {
  7.   if ($(fieldset).is('.collapsed')) {
  8.     // Action div containers are processed separately because of a IE bug
  9.     // that alters the default submit button behavior.
  10.     var content = $('> div:not(.action)', fieldset);
  11.     $(fieldset).removeClass('collapsed');
  12.     content.hide();
  13.     content.slideDown( {
  14.       duration: 'fast',
  15.       easing: 'linear',
  16.       complete: function() {
  17.         Drupal.collapseScrollIntoView(this.parentNode);
  18.         this.parentNode.animating = false;
  19.         $('div.action', fieldset).show();
  20.  
  21.         // >>>>
  22.         var editors = $(fieldset).find('.mceEditor');
  23.         $.each(editors, function() {
  24.             var instance = tinyMCE.get($(this).attr('id').replace('_parent', ''));
  25.  
  26.             // Add a min height it it doesn't have one yet
  27.             if (instance.plugins.autoresize && instance.plugins.autoresize.autoresize_min_height < 50) {
  28.                 instance.plugins.autoresize.autoresize_min_height = 50;
  29.             }
  30.             // Trigger the resize
  31.             instance.execCommand('mceAutoResize');
  32.         });
  33. 	// >>>
  34.       },
  35.       step: function() {
  36.         // Scroll the fieldset into view
  37.         Drupal.collapseScrollIntoView(this.parentNode);
  38.       }
  39.     });
  40.   }
  41.   else {
  42.     $('div.action', fieldset).hide();
  43.     var content = $('> div:not(.action)', fieldset).slideUp('fast', function() {
  44.       $(this.parentNode).addClass('collapsed');
  45.       this.parentNode.animating = false;
  46.     });
  47.   }
  48. };

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.