[EXTENSION] Bootstrap

I’m having a problem with Yii Booststrap datepicker and CJuiDialog in same screen, exactly what this guy reported in this topic.

http://www.yiiframework.com/forum/index.php/topic/42881-conflicting-widgets-cjuidialog-and-datepickerrow/

Someone know how i can solve this?

Hey guys, I have been using this extension for a while now - it really has been nice, but I had a need to get bootstrap 3 up and running and didn’t see any action on this - so, I did it myself over the past two weeks. This didn’t take a complete rewrite; however, there is some significant structural changes between bootstrap 2 and 3 which required a lot of code dissecting and rewriting.

At it’s core, this plugin is very similar to version 2.3.2. I attempted to leave the class structures alone so that the transition from the old version to this one would be fairly seemless. There are some places where I had to change things. I did my best to document the changes in the demo project.

This is not 100% perfect yet, I would consider it to be version 3.0 beta1. Please give me some feedback on what isn’t working for you and I’ll work on it some more. But for the most part, the demo page works like it is supposed to.

I also found a bug or two in the base code (specifically, you can now modify the label attribute while using textFieldRow). I will continue to maintain this as best I can while bootstrap 3 progresses.

Here’s the fork on bitbucket for the code (make sure you are on branch bootstrap 3)

h t t p s://bitbucket.org/xindexer/yii-bootstrap-3.0/src/591e92828d3b90b1b2a26a2c0a9314ba16d07867?at=bootstrap%203"]Yii-Bootstrap-3

sorry for the link format - apparently I don’t have URL embed privileges yet

Thanks man! Will test it now, was looking for something like this since bootstrap 3 release!

Testing right now, looks good! But jumbotron isn’t working…

Thanks

Hey,

Great extension, really helps me a lot !

i have a question regarding : bootstrap.widgets.TbNavbar

  1. is it possible to add a inline-form for a singup/login issue ? whats the best way to do that ?

  2. i have decided to add a button for now, ‘class’ => ‘bootstrap.widgets.TbButton’.

    its working fine , but how can i decide if this widget is visible or not ? like the CMenu widget . is that possible ?

Thanks again,

Amazing work.

1- yes it is possible for example:




<?php /** @var BootActiveForm $form */ $form = $this->beginWidget('bootstrap.widgets.TbActiveForm', array(     'id'=>'inlineForm',     'type'=>'inline',     'htmlOptions'=>array('class'=>'well'), )); ?>   <?php echo $form->textFieldRow($model, 'textField', array('class'=>'input-small')); ?> <?php echo $form->passwordFieldRow($model, 'password', array('class'=>'input-small')); ?> <?php $this->widget('bootstrap.widgets.TbButton', array('buttonType'=>'submit', 'label'=>'Log in')); ?>   <?php $this->endWidget(); ?>

for more information:

http://www.cniska.net/yii-bootstrap

hi all

I have followed the instructions to install this extension.

but I an facing a problem with the gii module

[font=Verdana][size=2]Alias "gii.GiiModule" is invalid. Make sure it points to an existing PHP file and the file is readable.[/size][/font]

I have set the path for the alias in main.php


Yii::setPathOfAlias('bootstrap', dirname(FILE).'/../extensions/bootstrap/'); 

and my gii configuration in main.php is as follow:




    'modules' => array(

        'gii' => array(

            'generatorPaths' => array(

                'bootstrap.gii',

            ),

        ),

what i have made wrong?[font=Verdana][/font]

Hello Guys,

I am new to yii. I have created a small app that helps manage daily expences. I have installed the yii-bootstrap and it appears to work fine on the default pages, but when I go to app the (http://localhost/yii_expences/index.php/records) it shows the default home page. Even when I try to access the gii page it shows me the home page. What have I missed or doing wrong. I have followed all the instructions given on here. http://www.cniska.net/yii-bootstrap/setup.html

screenshot

I am reading since several hours but can not find an answer to my question:

Is it enough to install yiistrap

or do I also have to install bootstrap + less

Sorry, I am shure the answer is somewhere … but I couldn’t find it. Hope someon can give me a quick help :slight_smile:

Hi I had same problem - in config/main

under modules -the gii lines should look like:

           'gii'=&gt;array(


                    'class'=&gt;'system.gii.GiiModule',


                    'generatorPaths' =&gt; array('bootstrap.gii',


                        ),


             .....

Hello! :)

My friends and I are creating a website and I’m in charge of the design. We are using Yii with Boostrap and I’m totally new to these two. I was used to creating CSS from scratch, so hundreds of lines of pre-made code is naturally kinda confusing for me. I would need your help with navbar - I need to change each button individually (preferably via class), so when you hover over it (or click on it), each button has a different color. I can’t seem to achieve this though; I can only change the properties of all of them at once. I’m pasting my chunks of relevant code below:

-from layouts/main.php




<div class="container" id="page">


    <?php $this->widget('booster.widgets.TbNavbar',array(

       // 'brand'=>'false',

        'fixed'=> 'false',

        'items'=>array(

            array(

                'class'=>'booster.widgets.TbMenu',

                'type'=> 'navbar',

                'items'=>array(

                array('label'=>'VOTE', 'url'=>array('/site/index'), 'class'=>'btn-vote'),

                array('label'=>'SUBMIT', 'url'=>array('/site/page', 'view'=>'about'), 'class'=>'btn-submit',

                    'items'=>array(

                        array('label'=>'Pictures', 'url'=>'#'),

                        array('label'=>'Videos', 'url'=>'#'),

                        array('label'=>'Music', 'url'=>'#'),

                        array('label'=>'Text', 'url'=>'#')

                    )

                ),

				array('label'=>'WHAT IS THIS', 'url'=>array('/site/contact')),

				array('label'=>'LOGIN', 'url'=>array('/site/login'), 'visible'=>Yii::app()->user->isGuest),

				array('label'=>'LOGOUT ('.Yii::app()->user->name.')', 'url'=>array('/site/logout'), 'visible'=>!Yii::app()->user->isGuest)

			),

		)))); ?>


	<?php echo $content; ?>


</div><!-- page -->



-from assets/.../bootstrap.css




.navbar-default .navbar-text {

  color: #777;

}

.navbar-default .navbar-nav > li > a {

  color: #000000;

  font-weight: bold;

  border-color: #ffffff;

}

.navbar-default .navbar-nav > li > a:hover,

.navbar-default .navbar-nav > li > a:focus {

  color: #46ff00;

  background-color: #f53eff;

  border-radius: 12px;

}


.navbar-default .navbar-nav > .active > a,

.navbar-default .navbar-nav > .active > a:hover,

.navbar-default .navbar-nav > .active > a:focus {

  color: #FFFFFF;

  background-color: #82cdf1;

  border-radius: 12px;

}



Can someone help me set these settings (bg color, border-radius, etc.) for each button from the array individually? Thank you!

What you’re looking for are these 3 parameters:

  • ‘htmlOptions’=>array(), //passing additional attributes to the “li” tag of that menu item

  • ‘linkOptions’=>array(), //passing additional attributes to the “a” tag of that menu item

  • ‘active’=>condition //define this link as active depending on the condition, see below




'items'=>array(

    array(

        'label'=>'Pictures', 

        'url'=>'#', 

        'htmlOptions'=>array(

            'class'=>'your-classname',

            'style'=>'...',

        ), 

        'linkOptions'=>array(

            'class'=>'your-classname', 

            'style'=>'...', 

            'target'=>'...',

            'onclick'=>'...',

        ), 

        'active'=>$this->id=='yourControllerName'&&$this->action->id=='yourActionName'), //$this->module->id

    ),

    array(

        'label'=>'Videos',

    ),

)



Leave away what you don’t need.

Happy Coding!

Thank you for a quick answer! :) However I still don’t know how do I call it (change the attributes) in the CSS. Shall I do it in the bootstrap.css chunk I posted or somewhere else? Thanks! :)

Unless you have a really good reason to do otherwise…

Always keep your own css classes separated so you know where they are.

[list=1]

[*]Add another css file under /css/ for instance /css/myStyles.css

[*]Then include this css file in the main view: /protected/views/layouts/main.php

[/list]

Are you really familiar with "creating CSS from scratch"?

What you need to do is override these classes in the newly added css file using the individual class names you have assigned to each of the elements; eg ".btn-about".

Try something like this…




.navbar-default .navbar-nav > li.btn-about > a:hover,

.navbar-default .navbar-nav > li.btn-about > a:focus { 

    color:red; 

}


.navbar-default .navbar-nav > .active > a.btn-about,

.navbar-default .navbar-nav > .active > a.btn-about:hover,

.navbar-default .navbar-nav > .active > a.btn-about:focus { 

    color:black; 

}



Another thing: What extension and version of Bootstap are you using anyways? It seems you’re mixing things that shouldn’t be mixed. This extension, “yii-bootstrap” based on this thread, is still using BS2 and can’t handle some of BS3’s new class names.

".navbar-default .navbar-nav" already is Bootstrap 3.

".navbar .nav" would still be Bootstrap 2.

Thanks for the answer, I’m sorry I just found out we are actually using YiiBooster with Boostrap extension, but many things are similar :) However, I already managed to style all the buttons to my liking :) I just needed to get rid of some pre-made lines and call the style via “.nav > li > a.btn-class:hover”, and now it works :) Thank you for your answers, they’ve been helpful! Cheers :)

hi i m new bie and i would like to use the bootstrapvalidator in my form to display the glyphicon in error message,can any one help to reach this,i m trying for this for one day in yii but i ve done this in plain html