Print Page - totally hide a layout region

Title: totally hide a layout region
Post by: jimmywon on March 05, 2014, 01:16:48 AM

Is possible to hide a region of layout totally?

example,

I wanna hide east region,
include collapsible button, header-panel, panel-body,...
(when hidden, don't occupy any space)

then program to collapse, expand the region.

Title: Re: totally hide a layout region
Post by: stworthy on March 16, 2014, 07:15:24 PM

Please download the updated layout plugin from http://www.jeasyui.com/easyui/plugins/jquery.layout.js and include it to the page.
To hide the ease region panel, please use the code below.

Code:

var c = $('#cc');
c.layout('panel','ease').panel('close');
c.layout('resize');

Title: Re: totally hide a layout region
Post by: korenanzo on December 11, 2014, 01:49:56 AM

Quote from: stworthy on March 16, 2014, 07:15:24 PM

To hide the ease region panel, please use the code below.

Code:

var c = $('#cc');
c.layout('panel','ease').panel('close');
c.layout('resize');

Hi,
this code does not work if the panel is collapsed.

Title: Re: totally hide a layout region
Post by: stworthy on December 11, 2014, 07:31:54 AM

Please try the extended 'open' and 'close' methods instead.

Code:

$.extend($.fn.layout.methods, {
  close: function(jq, region){
    return jq.each(function(){
      var c = $(this);
      closePanel(region);
      closePanel('expand'+region.substr(0,1).toUpperCase()+region.substr(1));
      c.layout('resize');

      function closePanel(region){
        var p = c.layout('panel', region);
        if (p){
          p.panel('close');
        }
      }
    })
  },
  open: function(jq, region){
    return jq.each(function(){
      var c = $(this);
      var p = $(this).layout('panel', region);
      var p1 = $(this).layout('panel', 'expand'+region.substr(0,1).toUpperCase()+region.substr(1));
      if (p.panel('options').collapsed){
        p1.panel('open');
      } else {
        p.panel('open');
      }
      $(this).layout('resize');
    })
  }
})

Usage example:

Code:

$('#cc').layout('close', 'east');  // close the east region panel
$('#cc').layout('open', 'east');  // open the east region panel

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jimmywon on March 05, 2014, 01:16:48 AM