Yii Framework Forum: [EXTENSION] Bootstrap - Yii Framework Forum

Jump to content

  • (45 Pages)
  • +
  • « First
  • 25
  • 26
  • 27
  • 28
  • 29
  • Last »
  • You cannot start a new topic
  • You cannot reply to this topic

[EXTENSION] Bootstrap Bringing together Yii and Twitter Bootstrap Rate Topic: ***** 23 Votes

#521 User is offline   mattiv 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 2
  • Joined: 11-July 12

Posted 11 July 2012 - 02:12 AM

Hi!

I'm having great difficulties in customizing the markup produced by the extension. For example, I want to create BootMenu tabs with an empty <i></i> next to the label text, in order to show an icon there. We're using CSS sprites, so just putting the icon as the label background and adding some padding won't do.

So here's what I want to achieve:
<ul class="nav nav-tabs ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
  <li class="active ui-state-default ui-corner-top ui-tabs-selected ui-state-active">
    <a href="#tabs-1"><i></i> View</a>
  </li>
  <li class="ui-state-default ui-corner-top">
    <a href="#tabs-2"><i></i> Edit</a></li>
</ul>


This is what I tried, but it encodes the '<' and '>' as html entities and just shows the <i></i> as text:
$this->widget('ext.bootstrap.widgets.BootMenu', array(
                'type' => 'tabs',
                'stacked' => false,
                'items' => array(
                    array('label' => "<i></i>".Yii::t('app', 'View'), 'url' => 'view', 'active' => true),
                    array('label' => "<i></i>".Yii::t('app', 'Edit'), 'url' => 'edit'),
                ),
            ));


This is not the only occation we had the need to tweak the Bootstrap markup a little bit, and it's always a bit too difficult, in my opinion: extending classes, overriding low-level functions etc.
0

#522 User is offline   Don Felipe 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 118
  • Joined: 02-January 11
  • Location:Saigon, Vietnam

Posted 11 July 2012 - 02:59 AM

View Postmattiv, on 11 July 2012 - 02:12 AM, said:

Hi!

I'm having great difficulties in customizing the markup produced by the extension. For example, I want to create BootMenu tabs with an empty <i></i> next to the label text, in order to show an icon there. We're using CSS sprites, so just putting the icon as the label background and adding some padding won't do.

So here's what I want to achieve:
<ul class="nav nav-tabs ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
  <li class="active ui-state-default ui-corner-top ui-tabs-selected ui-state-active">
    <a href="#tabs-1"><i></i> View</a>
  </li>
  <li class="ui-state-default ui-corner-top">
    <a href="#tabs-2"><i></i> Edit</a></li>
</ul>


This is what I tried, but it encodes the '<' and '>' as html entities and just shows the <i></i> as text:
$this->widget('ext.bootstrap.widgets.BootMenu', array(
                'type' => 'tabs',
                'stacked' => false,
                'items' => array(
                    array('label' => "<i></i>".Yii::t('app', 'View'), 'url' => 'view', 'active' => true),
                    array('label' => "<i></i>".Yii::t('app', 'Edit'), 'url' => 'edit'),
                ),
            ));


This is not the only occation we had the need to tweak the Bootstrap markup a little bit, and it's always a bit too difficult, in my opinion: extending classes, overriding low-level functions etc.


This is Sparta Bootstrap!

Bootstrap is already using CSS sprites to display all Glyphicons. No need to re-invent the wheel here. Check the demo page to find out how to do it. Of course, if you want to use your own sprites and set of icons, you need to overwrite all icon-related styles accordingly or use your very own css classes instead.

Displaying HTML tags inside labels is easy. Just set "encodeLabel" to false:

$this->widget('ext.bootstrap.widgets.BootMenu', array(
    'type' => 'tabs',
    'stacked' => false,
    'encodeLabel' => false,
    'items' => array(
         //your items
    ),
));

Good luck!
0

#523 User is offline   Müller 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 24
  • Joined: 23-June 12
  • Location:Netherlands

Posted 11 July 2012 - 02:59 AM

View Postmattiv, on 11 July 2012 - 02:12 AM, said:

Hi!

I'm having great difficulties in customizing the markup produced by the extension. For example, I want to create BootMenu tabs with an empty <i></i> next to the label text, in order to show an icon there. We're using CSS sprites, so just putting the icon as the label background and adding some padding won't do.

So here's what I want to achieve:
<ul class="nav nav-tabs ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
  <li class="active ui-state-default ui-corner-top ui-tabs-selected ui-state-active">
    <a href="#tabs-1"><i></i> View</a>
  </li>
  <li class="ui-state-default ui-corner-top">
    <a href="#tabs-2"><i></i> Edit</a></li>
</ul>


This is what I tried, but it encodes the '<' and '>' as html entities and just shows the <i></i> as text:
$this->widget('ext.bootstrap.widgets.BootMenu', array(
                'type' => 'tabs',
                'stacked' => false,
                'items' => array(
                    array('label' => "<i></i>".Yii::t('app', 'View'), 'url' => 'view', 'active' => true),
                    array('label' => "<i></i>".Yii::t('app', 'Edit'), 'url' => 'edit'),
                ),
            ));


This is not the only occation we had the need to tweak the Bootstrap markup a little bit, and it's always a bit too difficult, in my opinion: extending classes, overriding low-level functions etc.


Did you try adding the parameter "icon"?

Like this:
$this->widget('ext.bootstrap.widgets.BootMenu', array(
                'type' => 'tabs',
                'stacked' => false,
                'items' => array(
                    array('icon' => 'eye-open', 'label' => Yii::t('app', 'View'), 'url' => 'view', 'active' => true),
                    array('icon' => 'pencil', 'label' => Yii::t('app', 'Edit'), 'url' => 'edit'),
                ),
            ));


You can check the available icons here:
twitter.github.com/bootstrap/base-css.html#icons

You don't need to add the "icon-" and if you need the white version of the icon just use as:

'icon' => 'eye-open white'


I hope this helps you
0

#524 User is offline   mattiv 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 2
  • Joined: 11-July 12

Posted 11 July 2012 - 03:11 AM

Wow! Thanks for the both of you, really helpful and quick! Yeah, we want to use our own icons, but also some of bootstrap's default ones... The 'encoding => false' really helps in quite many other things, too!
0

#525 User is offline   Hector Lizarraga 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 1
  • Joined: 11-May 12

Posted 11 July 2012 - 10:37 AM

Hi Alanselvam

My situation is the same.

In my local dev machine (OSX, Yii 1.1.10, MAMP) the dropdown menu works ok but in the development server (Ubuntu 10.04, LAMP, Yii 1.1.10) the dropdownlist is not working.

Do you already solve this problem?
0

#526 User is offline   renathy 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 82
  • Joined: 05-July 11

Posted 12 July 2012 - 07:05 AM

When I add bootstrap extension to my config preload, then in debug window Chrome show error:

bootstrap.min.js: a("body").on("click.alert.data-api", b, c.prototype.close)
Error message is Object [object Object] has no method 'on'

Probably, because of this error CJui dialog is not working (also bootstrap modal window is not). When I remove bootstrap from preload, then CJui dialog is opening corectly.

I am using bootstrap for my backend that sits in a seperate folder (I have two folders - one for frontend, another for backend). Maybe some js or something is not loading correctly for backend folder?

I HAVE SOLVED THIS ISSUE WHEN UPDATED MY YII VERSION.

This post has been edited by renathy: 12 July 2012 - 07:24 AM

0

#527 User is offline   Junior - df9 

  • Advanced Member
  • PipPipPip
  • Yii
  • Group: Members
  • Posts: 416
  • Joined: 24-May 09
  • Location:Brazil

Posted 14 July 2012 - 05:59 AM

Hi there!

I'm trying to use the Carousel plugin but it doesn't work.

Why the BootCarousel widget doesn't register the needed js plugin file (/js/bootstrap-carousel.js) or where should they be registered?

I've searched all the extension code, but could not find the place where js files for plugins are registered.

Am I missing something?

Thank you

Regards
______________________________________
Junior
df9.com.br
Linux Registered User #364954
GNU/Linux: together we're ready!
0

#528 User is offline   Don Felipe 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 118
  • Joined: 02-January 11
  • Location:Saigon, Vietnam

Posted 14 July 2012 - 10:04 AM

View PostJunior - df9, on 14 July 2012 - 05:59 AM, said:

Hi there!

I'm trying to use the Carousel plugin but it doesn't work.

Why the BootCarousel widget doesn't register the needed js plugin file (/js/bootstrap-carousel.js) or where should they be registered?

I've searched all the extension code, but could not find the place where js files for plugins are registered.

Am I missing something?

Thank you

Regards


What yii-bootstrap version do you use?

From 0.9.12 onwards there's only 1 minimized JS file (24kb!) - no more plugins need to be registered - and the carousel works just fine.
0

#529 User is offline   Philipp 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 8
  • Joined: 13-July 12

Posted 14 July 2012 - 12:12 PM

Any news about the integration of Bootstrap Datepicker ? :)

(can't repost the link as this is my first posting on the forums, see a couple of pages ahead)
0

#530 User is offline   Junior - df9 

  • Advanced Member
  • PipPipPip
  • Yii
  • Group: Members
  • Posts: 416
  • Joined: 24-May 09
  • Location:Brazil

Posted 14 July 2012 - 08:46 PM

View PostDon Felipe, on 14 July 2012 - 10:04 AM, said:

What yii-bootstrap version do you use?

From 0.9.12 onwards there's only 1 minimized JS file (24kb!) - no more plugins need to be registered - and the carousel works just fine.



Thanks for replying, 0.10.1 version, total lost in the dark...after some tests in localhost, even registering manually, it does not work....i'm wondering there must be something wrong with the environment, will try tomorrow in my hosting and post here if it works

thanks again

regards
______________________________________
Junior
df9.com.br
Linux Registered User #364954
GNU/Linux: together we're ready!
0

#531 User is offline   Don Felipe 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 118
  • Joined: 02-January 11
  • Location:Saigon, Vietnam

Posted 14 July 2012 - 10:02 PM

View PostJunior - df9, on 14 July 2012 - 08:46 PM, said:

Thanks for replying, 0.10.1 version, total lost in the dark...after some tests in localhost, even registering manually, it does not work....i'm wondering there must be something wrong with the environment, will try tomorrow in my hosting and post here if it works

thanks again

regards


Just downloaded the latest 0.10.1, used the carousel from the demo page, and tested it on Yii 0.1.10 and 0.1.11-dev. Carousel's working fine. Again, no plugin needs to be registered - just 1 bootstrap.min.js.

Are there any error messages in firebug on your side? Do you at least see the carousel or does Yii return whatever widget-related error message? Are you using the demo code (carousel)? Do all the other JS elements of Yii-Bootstrap (still) work?

Good luck!
0

#532 User is offline   Junior - df9 

  • Advanced Member
  • PipPipPip
  • Yii
  • Group: Members
  • Posts: 416
  • Joined: 24-May 09
  • Location:Brazil

Posted 15 July 2012 - 08:49 AM

View PostDon Felipe, on 14 July 2012 - 10:02 PM, said:

Just downloaded the latest 0.10.1, used the carousel from the demo page, and tested it on Yii 0.1.10 and 0.1.11-dev. Carousel's working fine. Again, no plugin needs to be registered - just 1 bootstrap.min.js.

Are there any error messages in firebug on your side? Do you at least see the carousel or does Yii return whatever widget-related error message? Are you using the demo code (carousel)? Do all the other JS elements of Yii-Bootstrap (still) work?

Good luck!


it's weird, no messages in firebug, no errors from Yii

the html markup is generated, the js code also $('.carousel').carousel(), but the widget shows the content as common <ul> list (images and text)

haven't tested other js components

given the urgence of delivering this to the client, I've decided to put nivoslider to do the job and latter will investigate this deeply

again, thanks very much for your time and your help

=))
______________________________________
Junior
df9.com.br
Linux Registered User #364954
GNU/Linux: together we're ready!
0

#533 User is offline   renathy 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 82
  • Joined: 05-July 11

Posted 17 July 2012 - 04:51 AM

Hi!
I need two submit buttons, but both should do submit to different url.

// this button submits to action update and this is fine
			$this->widget('bootstrap.widgets.BootButton', array(
				'buttonType'=>'submit',
				'type'=>'primary',
				'label'=>$model->isNewRecord ? 'Create' : 'Save',
			));		

// i need this button to submit to action confirm and not update, but this doesn't work !!!!!!!!!

			$this->widget('bootstrap.widgets.BootButton', array(
				'url' => array('confirm', 'id' => $model->id),   
				'buttonType'=>'submit',
				'type'=>'primary',
				'label'=>Yii::t('shop', 'Save&Confirm'),
			));

0

#534 User is offline   Philipp 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 8
  • Joined: 13-July 12

Posted 18 July 2012 - 10:51 AM

Has anyone implemented the bootstrap.widgets.BootTabbable tabs with dynamic content in the tabs using AJAX requests and can hint me in the right direction on how to implement this?
0

#535 User is offline   its.jawad 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 10
  • Joined: 05-July 12

Posted 19 July 2012 - 03:55 AM

How can I insert an attribute in the link generating through following code ? (htmlOptions not working in this case)


<?php $this->widget('bootstrap.widgets.BootMenu', array(
'type'=>'list',
'items'=>array(
array('label'=>'LIST HEADER'),
array('label'=>'Home', 'icon'=>'home', 'url'=>'#', 'htmlOptions'=>array('data'=>'any')),
),
)); ?>
0

#536 User is offline   Don Felipe 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 118
  • Joined: 02-January 11
  • Location:Saigon, Vietnam

Posted 19 July 2012 - 04:00 AM

View Postits.jawad, on 19 July 2012 - 03:55 AM, said:

How can I insert an attribute in the link generating through following code ? (htmlOptions not working in this case)


<?php $this->widget('bootstrap.widgets.BootMenu', array(
'type'=>'list',
'items'=>array(
array('label'=>'LIST HEADER'),
array('label'=>'Home', 'icon'=>'home', 'url'=>'#', 'htmlOptions'=>array('data'=>'any')),
),
)); ?>


If the HTML element is a link, you need to use 'linkOptions' instead of 'htmlOptions'.
0

#537 User is offline   gv0zd 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 44
  • Joined: 06-April 12

Posted 20 July 2012 - 06:27 AM

I want to use Bootstrap extension only in one module of my app
How should I change default code in config
'preload'=>array(
    .....
    'bootstrap', // preload the bootstrap component
),
'modules'=>array(
    .....
    'gii'=>array(
        .....
        'generatorPaths'=>array(
            'bootstrap.gii', // since 0.9.1
        ),
    ),
),
'components'=>array(
    .....
    'bootstrap'=>array(
        'class'=>'ext.bootstrap.components.Bootstrap', // assuming you extracted bootstrap under extensions
    ),
),

I've tried to do it in different ways but couldn't get a result
0

#538 User is offline   yiistudent 

  • Newbie
  • Yii
  • Group: Members
  • Posts: 15
  • Joined: 15-November 10

Posted 24 July 2012 - 03:57 PM

Hello Al.. I have problem with my fresh bootstraps installation..
this my error message:


CException

Description
Property "CUrlManager.bootstrap" is not defined


Source File
Applications/XAMPP/xamppfiles/htdocs/yii/framework/YiiBase.php(208)


Could u help me?


Quote

Edit:
I solve my problem, just error writing in component..
Nice extention

0

#539 User is offline   Sampa 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 173
  • Joined: 18-December 11
  • Location:Stockholm,Sweden

Posted 25 July 2012 - 12:51 PM

View Postgv0zd, on 20 July 2012 - 06:27 AM, said:

I want to use Bootstrap extension only in one module of my app
How should I change default code in config
'preload'=>array(
    .....
    'bootstrap', // preload the bootstrap component
),
'modules'=>array(
    .....
    'gii'=>array(
        .....
        'generatorPaths'=>array(
            'bootstrap.gii', // since 0.9.1
        ),
    ),
),
'components'=>array(
    .....
    'bootstrap'=>array(
        'class'=>'ext.bootstrap.components.Bootstrap', // assuming you extracted bootstrap under extensions
    ),
),

I've tried to do it in different ways but couldn't get a result

Set it up as normally, then only use the widgets etc in the module. There is nothing that forces you to use it outside of the module even if you install bootstrap normally.
0

#540 User is offline   Sampa 

  • Standard Member
  • PipPip
  • Yii
  • Group: Members
  • Posts: 173
  • Joined: 18-December 11
  • Location:Stockholm,Sweden

Posted 25 July 2012 - 12:52 PM

View Postgv0zd, on 20 July 2012 - 06:27 AM, said:

I want to use Bootstrap extension only in one module of my app
How should I change default code in config
'preload'=>array(
    .....
    'bootstrap', // preload the bootstrap component
),
'modules'=>array(
    .....
    'gii'=>array(
        .....
        'generatorPaths'=>array(
            'bootstrap.gii', // since 0.9.1
        ),
    ),
),
'components'=>array(
    .....
    'bootstrap'=>array(
        'class'=>'ext.bootstrap.components.Bootstrap', // assuming you extracted bootstrap under extensions
    ),
),

I've tried to do it in different ways but couldn't get a result

Set it up as normally, then only use the widgets etc in the module. There is nothing that forces you to use it outside of the module even if you install bootstrap normally.
0

Share this topic:


  • (45 Pages)
  • +
  • « First
  • 25
  • 26
  • 27
  • 28
  • 29
  • Last »
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users