Hello,
I have trouble to insert content of tab in tabView, from another xhtml file.
this is function I use:
- function addTab(tabManager, href , label, index) {
var tabExists = false;
var $tabs = jQuery(tabManager.jqId).tabs({
tabTemplate: '<li><a href="#{href}">#{label}</a> <span class="ui-icon ui-icon-close">Remove Tab</span></li>',
add: function(event, ui) {
$(this).tabs('select',ui.index);
$("#"+href).load('pages/'+href+'.xhtml');
},
fx: {
height: 'toggle',
opacity: 'toggle'
},
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html(
"Couldn't load this tab. We'll try to fix this as soon as possible. "
);
}
}
});
jQuery(tabManager.jqId+' span.ui-icon-close' ).live( 'click',
function() {
var index = jQuery( 'li', $tabs ).index( jQuery( this ).parent() );
if(index != -1)
$tabs.tabs( 'remove', index );
}
);
jQuery(tabManager.jqId+' ul li a').each(function(i) {
if (this.text == label) {
tabExists = true;
index = i;
}
});
if(tabExists) {
$tabs.tabs('select', index);
} else {
$tabs.tabs('add', "pages/"+href+".xhtml", label);
}
return false;
}
and this is pages/test1.xhtml which content I try to load as tab content:
- <?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:body>
<h:panelGroup id="container" layout="block" style="height: 100%">
<h2>First Page!</h2>
<h3>Popup calendar</h3>
<p:calendar pattern="dd.mm.yyyy"></p:calendar>
</h:panelGroup>
</h:body>
</html>
But the problem is that I only see html tags in tab content:
- First Page!
Popup calendar
Am I missing something, or maybe load function can not load xhtml pages?
Thanks for any help ...