Print Page - How to add a panel to the portal layout given its id?

I have several panels created like this:

Code:

<div id="w007" class="easyui-panel" title="Events" collapsible="true" closable="false">
  my content here...
</div>

Each of those panels (ids: w001, w002, .... w012) are placed on the page inside a hidden div, and later need to be moved into the portal.

The example in the portal documentation for adding a panel to the portal only shows how to do it for a dynamically created panel:

Code:

var p = $('<div></div>').appendTo('body');
p.panel({ ... sets up the portal properties dynamically ...});
$('#pp').portal('add', {  
    panel: p,  
    columnIndex: 0  
});

My question is how do you write the code to add the panel to the portal if the panel was NOT created dynamically, using the panel's unique id?

My solution:

Code:

//dynamically add a single widget to the portal
function addPortalWidget(pID, wID, cID, isClosed, isCollapsed){//add a single widget wID to the pID portal
	//portal id, widget id, which column, whether closed, whether collapsed
	//moves the widget from the staging area into the portal area specified and gives it these properties
	if ($("#" + wID).length) { //if the widget exists (if this user is allowed to see it)
		//determine whether to initially collapse it
		if (isCollapsed == true || isCollapsed == "true") {//if it is supposed to be collapsed
			$("#" + wID).panel({ collapsed: true });//collapse it
		}//end if it is supposed to be collapsed
		else {//else if it is NOT supposed to be collapsed
			$("#" + wID).panel({ collapsed: false });//expand it
		}//end else if it is NOT supposed to be collapsed
		//determine whether to initially close it
		if (isClosed == true || isClosed == "true") {//if it is supposed to be closed
			$("#" + wID).panel({ closed: true });	//close it
		}//end if it is supposed to be closed
		else {//else it is NOT supposed to be closed
			$("#" + wID).panel({ closed: false }); //open it
		}//end else it is NOT supposed to be closed
		//add it to the portal at the bottom of the specified column
		//Note: widgets are saved in the order they appear, so when we add them to the portal from the
		//save values, it automatically puts them back in the correct order
		$("#" + pID).portal('add', { panel: $("#" + wID), columnIndex: cID });
		//hide closed widgets
		if (isClosed == true || isClosed == "true") { //if the widget is closed
			$("#" + wID).parent().css('display', 'none'); //hide it
		}//end if the widget is closed
	}//end if the widget exists (if this user is allowed to see it)
	//else the widget was not allowed, so don't add it to the portal
}//end add a single widget wID to the pID portal

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: tslatt on August 08, 2011, 09:23:02 AM