Petite question
Je suis en train de passer mon site en twitter bootstrap.
J'ai une navbar qui doit tout le temps être présente en haut (.navbar-fixed-top)
Cela marche très bien sauf que j'aimerais bien que l'élément sélectionné reste actif.
Comme le site de grafikart par exemple, le tab forum est activé pour le moment.
Voici mon layout:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title><?php echo $title_for_layout; ?></title>
<link rel="stylesheet/less" href="<?php echo $this->Html->url('/css/bootstrap.less'); ?>">
<?php // echo $this->Html->css('bootstrap'); ?>
<?php echo $this->Html->script('jquery'); ?>
<?php echo $this->Html->script('jquery-ui'); ?>
<?php echo $this->Html->script('less'); ?>
<?php echo $this->Html->script('bootstrap-tab'); ?>
<?php echo $this->Html->script('bootstrap-dropdown'); ?>
<?php echo $this->Html->script('datepicker'); ?>
<?php echo $this->Html->script('common'); ?>
<?php echo $this->Html->css('jquery-ui'); ?>
<?php echo $this->fetch('meta');
echo $this->fetch('css');
echo $this->fetch('script'); ?>
</head>
<body data-toggle="tab">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="#">Administration -> <?php echo AuthComponent::user('username'); ?></a>
<?php echo $this->element('admin_menu'); ?>
</div>
</div>
</div>
<div class="container">
<?php echo $this->Session->flash(); ?>
<?php echo $this->fetch('content');
?>
</div>
<?php echo $this->element('sql_dump'); ?>
</body>
</html>
Je crée la nav-bar dans le layout et j'ai mis le contenu dans un element <?php echo $this->element('admin_menu'); ?> que voici
<ul class="nav">
<li><?php echo $this->Html->link('Employés',array('controller'=>'employees','action'=>'index','admin'=>true)); ?></li>
<li><?php echo $this->Html->link('Utilisateurs',array('controller'=>'users','action'=>'index','admin'=>true)); ?></li>
<li><?php echo $this->Html->link('Groupes',array('controller'=>'groups','action'=>'index','admin'=>true)); ?></li>
</ul>
<ul class="nav pull-right">
<li><?php echo $this->Html->link('Site interne',array('controller'=>'employees','action'=>'index','admin'=>false)); ?></li>
<li><?php echo $this->Html->link('acl',array('controller'=>'acl','action'=>'index','admin'=>true)); ?></li>
<li><?php echo $this->Html->link('Logout',array('controller'=>'users','action'=>'logout','admin'=>false),array('class'=>'pull-right')); ?></li>
</ul>
Clairement, mon problème est au niveau JS, j'ai essayé toute sorte de trucs sans succès.
Merci pour votre aide
Olivier alias skwafi
Finalement, j'ai trouvé une technique.
J'aurais préféré faire plus propre, mais bon ça marche:
element('admin_menu')
<?php
$current_page = $this->params'controller'];
?>
<ul class="nav">
<li <?php if($current_page=="employees"){echo'class="active"';} ?>>
<?php echo $this->Html->link('Employés',array('controller'=>'employees','action'=>'index','admin'=>true)); ?></li>
<li <?php if($current_page=="users"){echo'class="active"';} ?>>
<?php echo $this->Html->link('Utilisateurs',array('controller'=>'users','action'=>'index','admin'=>true)); ?></li>
<li <?php if($current_page=="groups"){echo'class="active"';} ?>>
<?php echo $this->Html->link('Groupes',array('controller'=>'groups','action'=>'index','admin'=>true)); ?></li>
</ul>
<ul class="nav pull-right">
<li><?php echo $this->Html->link('Site interne',array('controller'=>'employees','action'=>'index','admin'=>false)); ?></li>
<li><?php echo $this->Html->link('acl',array('controller'=>'acl','action'=>'index','admin'=>true)); ?></li>
<li><?php echo $this->Html->link('Logout',array('controller'=>'users','action'=>'logout','admin'=>false),array('class'=>'pull-right')); ?></li>
</ul>
OLivier alias skwafi