widget & javascript

Yii 1.1 Extensions
1

Hi All

I am new to yii, so sorry for all the stupid questions in advance. :lol:

Problem:

I have a bare basic YII 1.1.9 with Bootstrap working. I am trying to get a login widget to have the bootstrap modal look and feel. but having trouble making the link generated by "$this->widget" to render the way i wanted. Now might be lot more obvious with the code.

This is the code i use to call the widget.


$this->widget('UserLoginWidget',array('visible'=>Yii::app()->user->isGuest, 'class'=>'btn btn-primary', 'data_toggle'=>'modal'));

It generates a link that looks like this when I view source:


<a onclick="$('#userloginwidget').dialog('open'); return false;" href="#">User Login</a>

But I need the link to look like this for the bootstrap modal to work


<a class="btn" data-toggle="modal" href="#UserLoginWidget" onclick="$('#userloginwidget').modal(show); return false" >Launch Modal</a>

The code that renders the widget.


<?php $this->beginWidget('bootstrap.widgets.BootModal', array(

    'id'=>'UserLoginWidget',

    'htmlOptions'=>array('class'=>'hide'),

    'events'=>array(

        'show'=>"js:function() { console.log('modal show.'); }",

        'shown'=>"js:function() { console.log('modal shown.'); }",

        'hide'=>"js:function() { console.log('modal hide.'); }",

        'hidden'=>"js:function() { console.log('modal hidden.'); }",

    ),

)); ?>


<div class="modal-header">

    <a class="close" data-dismiss="modal">&times;</a>

    <h3>Modal header</h3>

</div>

<div class="modal-body">

    <p>One fine body…</p>

</div>

<div class="modal-footer">

    <?php echo CHtml::link('Save changes', '#', array('class'=>'btn btn-primary', 'data-dismiss'=>'modal')); ?>

    <?php echo CHtml::link('Close', '#', array('class'=>'btn', 'data-dismiss'=>'modal')); ?>

</div>


<?php $this->endWidget(); ?>

Any ideas. And thanks in advance.

Best Regards

Jason

2

now after some more reading, i noticed the CWidget is extended from CJuiWidget, so how can I override it to have the extra options in the link to make use of bootstrap modal. Or I am heading down the wrong direction? Thanks again.

3

It’s funny how you answer your own questions. Found the solutions. just include a

CHTML:Link before the “$this->beginWidget()”, that was 2 hours of searching… :blink:

feeling real stupid.