Loading...

Search jQuery

Search

jQuery Forum

Problem with load function

in Using jQuery • 10 years ago

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 ...

1