create customize dropdown in tabnav bootstrap ext by criss83
Requirements ¶
Usage ¶
- downloald and install bootsrap extension by chris83
- download and extract file bootstrap-ext to extension path
- create tabnav in your layout
//layouts/main.php
Yii::setPathOfAlias('_partials', dirname(__FILE__).DIRECTORY_SEPARATOR.'..'.DIRECTORY_SEPARATOR.'_partials');
$this->widget('bootstrap.widgets.TbNavbar',array(
'brand'=>'<small><i class="icon-leaf"></i>Admin</small>',
'htmlOptions'=>array('class'=>'navbar-inverse'),
'fluid'=>true,
'items'=>array(
array(
'class'=>'ext.bootstrap-ext.widgets.TbMenuExt',
'htmlOptions'=>array('class'=>'pull-right'),
'items'=>array(
array(
'icon'=>'icon-tasks',
'label'=>'<span class="badge badge-grey">4</span>',
'url'=>'javascript:void(0)',
'linkOptions'=>array('class'=>'dropdown-toggle','data-toggle'=>'dropdown'),
'itemOptions'=>array('class'=>'grey'),
'class'=>'ext.bootstrap-ext.widgets.TbDropdownExt',
'view'=>'_partials._usermenu_loginform',
'submenuOptions'=>array('class' => 'fixed-panel pull-right dropdown-navbar dropdown-caret dropdown-closer'),
),
),
));
simple fixed login panel bootstrap dropdown examample : placed in /themes/yourtheme/views/_partials called by : _partials._usermenu_loginform
or
/protected/views/_partials called by : ext.views._partials._usermenu_loginform
//_usermenu_loginform.php
<li class="login">
<form>
<input type="text" name="username" placeholder="Username" value=""/>
<input type="text" name="password" placeholder="Password" value=""/>
<button class="login">Login</button>
</form>
</li>
<?php
$cs = Yii::app()->clientScript;
$cs->registerScript('fixed_dropdown','
jQuery("ul.fixed-panel.dropdown-menu").click(function(){
return false;
});
jQuery("ul.dropdown-menu li button.login").click(function(){
//handler your form here
jQuery("li.open").removeClass("open");
});
',CClientScript::POS_READY);
?>
Sheillendra
TbDropdownExt can't find the view "find_partials._usermenu_task".
Can you give me a example code please? Thank you!
TbDropdownExt can't find the view "find_partials._usermenu_task".
$themeBaseUrl = Yii::app()->theme->getBaseUrl(); Yii::setPathOfAlias('_partials', dirname(__FILE__).DIRECTORY_SEPARATOR.'..'.DIRECTORY_SEPARATOR.'_partials');above code for used of themes, if not used of themes, change this code to call
'view'=>'_partials._usermenu_task',with
'view'=>'ext.views._partials._usermenu_task',in views folder you must create _partials folder and place _usermenu_task.php there
example _usermenu_task.php :
echo '<li>'; //your login form or other list echo '</li>'Example: _usermenu_task.php: Login form
But when click into textfield on dropdown: Dropdown is hide.
Do you have any solution for this problem?
Fixed Dropdown
this simple login form fixed dropdown bootstrap
<li class="login"> <form> <input type="text" name="username" placeholder="Username" value=""/> <input type="text" name="password" placeholder="Password" value=""/> <button class="login">Login</button> </form> </li> <?php $cs = Yii::app()->clientScript; $cs->registerScript('fixed_dropdown',' jQuery("ul.fixed-panel.dropdown-menu").click(function(){ return false; }); jQuery("ul.dropdown-menu li button.login").click(function(){ //handler your form here jQuery("li.open").removeClass("open"); }); ',CClientScript::POS_READY); ?>add "fixed-panel" to class name of panel in TabNav widget :
'class'=>'ext.bootstrap-ext.widgets.TbDropdownExt', 'view'=>'_partials._usermenu_loginform', 'submenuOptions'=>array('class' => 'fixed-panel pull-right dropdown-navbar'),please help with the form handler
please help with the form handler
<?php echo TbHtml::beginFormTb(TbHtml::FORM_LAYOUT_HORIZONTAL,'/user/user/auth'); ?> <?php echo TbHtml::emailFieldControlGroup('email', '', array('label' => 'Email', 'placeholder' => 'Email')); ?> <?php echo TbHtml::passwordFieldControlGroup('password', '', array('label' => 'Password', 'placeholder' => 'Password')); ?> <?php echo TbHtml::checkBoxControlGroup('rememberMe', false, array( 'label' => 'Remember me', 'controlOptions' => array('after' => TbHtml::submitButton('Sign in',array('onclick'=>'btn.submit()'))), )); ?> <?php echo TbHtml::endForm(); ?><?php
$cs = Yii::app()->clientScript;
$cs->registerScript('fixed_dropdown','
jQuery("ul.fixed-panel.dropdown-menu").click(function(){ return false; }); jQuery("ul.dropdown-menu li button.login").click(function(){//handler
jQuery("class-group controls btn").click(function(){submit();}); jQuery("li.open").removeClass("open"); });',CClientScript::POS_READY);
?>
form handler
use submit ajax and reload page if login success
change your form :
'controlOptions' => array('after' => TbHtml::submitButton('Sign in',array('onclick'=>'return false'))),change jQuery Script :
$cs = Yii::app()->clientScript; $cs->registerScript('fixed_dropdown',' jQuery("ul.fixed-panel.dropdown-menu").click(function(){ return false; }); jQuery("ul.dropdown-menu li button.login").click(function(){ jQuery.ajax({ url : '', //url controller handling ajax data : , //bind data from form success : function(res){ if(typeof data.loged != 'undefined' && data.loged == true){ window.location= window.returnUrl; } } }); jQuery("li.open").removeClass("open"); }); ',CClientScript::POS_READY);If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.