web-dev-qa-db-fra.com

Comment définir les options pour JHtmlTabs avec Bootstrap

Selon tilisation de la classe JHtmlTabs dans un composant , plusieurs options peuvent être spécifiées pour les onglets en cours de rendu. Cependant, à l'aide de l'exemple, aucun des événements ne se déclenche et ni le "startOffset" ni le "useCookie" initiaux ne sont respectés - la page se comporte de la même manière, que ce code soit présent ou non, sans erreur JS indiquée.

$options = array(
    'onActive' => 'function(title, description){
        console.info("Fired OnActive");                // Never fires
        description.setStyle("display", "block");
        title.addClass("open").removeClass("closed");
    }',
    'onBackground' => 'function(title, description){
        console.info("Fired OnBackground");            // Never fires
        description.setStyle("display", "none");
        title.addClass("closed").removeClass("open");
    }',
    'startOffset' => 4,                                // No tabs are active 
    'useCookie' => true,                               // Last active tab is not rememberd
    'active'    => 'myTabName'                         // Not in docs, but DOES work
);

Mettre à jour

Réalisation du fait que j'utilise les onglets avec Bootstrap, le code est différent pour JHtml

// This works, per the docs, and using `tabs.start`, etc.
echo JHtml::_('tabs.start', 'tab_group_id', $options);
echo JHtml::_('tabs.panel', JText::_('PANEL_1_TITLE'), 'panel_1_id');
echo 'Panel 1 content can go here.';
echo JHtml::_('tabs.panel', JText::_('PANEL_2_TITLE'), 'panel_2_id');
echo 'Panel 2 content can go here.';
echo JHtml::_('tabs.end');

// This does NOT work, using `bootstrap.` 
echo JHtml::_('bootstrap.startTabSet', 'tab_group_id', $options);
echo JHtml::_('bootstrap.addTab', JText::_('PANEL_1_TITLE'), 'panel_1_id');
echo 'Panel 1 content can go here.';
echo JHtml::_('bootstrap.endTab');
echo JHtml::_('bootstrap.addTab', JText::_('PANEL_2_TITLE'), 'panel_2_id');
echo 'Panel 2 content can go here.';
echo JHtml::_('bootstrap.endTab');

echo JHtml::_('bootstrap.endTabSet');

Quelqu'un at-il eu de la chance de travailler avec succès avec $options et Bootstrap ??

cookiesjhtml
4
GDP

Ce n'est pas une réponse à la question, mais une solution au problème qui a provoqué la question à l'aide de jQuery Cookie Plugin :

jQuery(document).ready(function($) {
    var listItems = $("#tab_group_idTabs li");
    var prefix = 'myID-';
    listItems.each(function(li) {
        var a = $(this).children().first("a");
        var Word = a.attr('href').replace('#','');
        a.attr('id',prefix+'A-' + Word);    // Add an ID to the A
        a.addClass('myTabClass');           // Add a dashboard class to the A
    });

    var activeTab = $.cookie("activeTab");  // Get the last active tab for the page
    if(activeTab === undefined){
        var activeTab = "#myID-A-tab3";     // Specify the default Tab ID here
    }
    $.cookie("activeTab", activeTab);       // Store the last active tab
    $(activeTab).click();                   // Activate the active tab

    $(".myTabClass").click(function(){      // Click event to store last active tab
        var clickedTab = '#'+$(this).attr('id');
        $.cookie("activeTab", clickedTab);
    });
});
2
GDP

Tout simplement cela fonctionne pour moi

<?php 
$options = array(
'active'    => 'tab1_id'    // Not in docs, but DOES work
); ?>


<?php echo JHtml::_('bootstrap.startTabSet', 'ID-Tabs-Group', $options);?> 

<?php echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab1_id', JText::_('COM_BOOTSTRAPTABS_TAB_1')); ?> 
<p>Content of the first tab.</p> 
<?php echo JHtml::_('bootstrap.endTab');?> 

<?php echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab2_id', JText::_('COM_BOOTSTRAPTABS_TAB_2')); ?> 
<p>Content of the second tab.</p> 
<?php echo JHtml::_('bootstrap.endTab');?> 

<?php echo JHtml::_('bootstrap.endTabSet');?>
2
Anant

add JHtml :: _ ('behavior.tabstate');

https://www.web357.eu/blog/news/how-to-remember-tab-with-a-session-at-joomla-backend

0
Oleg Gorilyk