EasyUI Forum
September 13, 2025, 06:48:04 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: totally hide a layout region  (Read 10297 times)
jimmywon
Newbie
*
Posts: 11


View Profile
« 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.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 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');
Logged
korenanzo
Guest
« Reply #2 on: December 11, 2014, 01:49:56 AM »

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.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 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
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!