how to render a div on tab

[anas_elf]

Hi there,

I'm newbie to easyui and I want to use the easyui to my existing framework beside on JSP custom tag.

I'm trying to render the tabs first and then render my custom tags after that inside a div, I want the div get displayed inside the tab. same idea to the menu is that possible to do in easyui.

TAB

1) Render the tabs first
 <div class="easyui-tabs" style="width:700px;height:250px">
        <div title="About"    style="padding:10px">    </div>
        <div title="My Documents" style="padding:10px">  </div>
        <div title="Help" data-options="iconCls:'icon-help',closable:true" style="padding:10px">    </div>
 </div>

2) Render my div

<div id="myDIV">
     My content
</div>

3) display the content of "myDIV" inside the "About" tab,
in such way like this:
<div title="About"  content="myDIV" style="padding:10px">    </div>

is that possible? and how I can do it?

[stworthy]

The 'content' property of panel has been defined in easyui, you must to select another name such as 'content2'.
To display the 'content2' inside a tab panel when opened, try this:

Code:

<div id="tt" class="easyui-tabs" style="width:700px;height:250px">
	<div title="About" style="padding:10px" data-options="content2:'#myDIV'">    </div>
	<div title="My Documents" style="padding:10px">  </div>
	<div title="Help" data-options="iconCls:'icon-help',closable:true" style="padding:10px">    </div>
</div>
<div id="myDIV">
     My content
</div>
<script>
$.fn.panel.defaults.onOpen = function(){
	var opts = $(this).panel('options');
	if (opts.content2){
		$(opts.content2).appendTo(this);
	}
};
</script>