Yii 1.1: xdetailview

This extension modified CDetailView to support multiple label/value pairs per line.
12 followers

Yii default CDetailView display one label/value pair per line. With this widget you could display multiple label/value pairs per line. Also if you use null as your attribute item, you can nicely layout your detail view.

Update

  • version 0.0 - start from CDetailView
  • version 1.0 - supports multiple columns label/value pair
  • version 2.0 - supports nested {attributes}

Requirements

Tested under Yii 1.1.10

Usage

in your /views/<model>/view.php file, replace CDetaiView with XDetailView

newly added parameter : ItemColumns specify number of label/value pair per line, null in attributes array for purpose of adjusting layout

<?php $this->widget('application.components.widgets.XDetailView', array(
    'data' => $model,
    'ItemColumns' => 2,
    'attributes' => array(
            'account',
            'company',
            'address1',
            'address2',
            'city',
            'province',
            null,
            array(
                'label'=>'Created:',
                'type'=>'raw',
                'value'=>$model->create_time,
            ),
            null,
            array(
                'label'=>'Updated:',
                'type'=>'raw',
                'value'=>$model->update_time,
            ),
    ),
)); ?>

Usage - Scenario Two - multiple widgets - depreciated

in case you have a field with long text or an image, you may have a little bit trouble to layout them nicely use nether CDetailView or XDetailView, however you can simply do the following trick:

*note: initially I thought about to modified original code to handle this case, then I figure it's too much hacking, so I come up with this simple trick

<?php $this->widget('application.components.widgets.XDetailView', array(
    'data' => $model,
    'ItemColumns' => 2,
    'attributes' => array(
            'account',
            'company',
            'city',
            'province',
    ),
)); ?>
 
//2nd widget goes here for the same model
<?php $this->widget('application.components.widgets.XDetailView', array(
    'data' => $model,
    'ItemColumns' => 1, // one pair per line here
    'attributes' => array(
            'long_text_field',
    ),
)); ?>
 
//if you have model with hundreds of fields, more XDetailView widgets with different *ItemColumns* value from sample model could goes on & on here.

Usage - Version 2.0

supports nested {attribues}.

<?php $this->widget('application.components.widgets.XDetailView', array(
    'data' => $model,
    'attributes' => array(
        'group1'=>array(
            'attributes' => array(
                    'account',
                    'company',
                    'city',
                    'province',
            ),
        ),
        'group2'=>array(
            'ItemColumns' => 2,
            'attributes' => array(
                    'account',
                    'company',
                    'city',
                    'province',
            ),
        ),
        'group3'=>array(
            'ItemColumns' => 1, // one pair per line here
            'attributes' => array(
                'long_text_field',
            ),
        ),
    ),
)); ?>

Resources

CDetailView

Total 8 comments

#13094 report it
Ravi P Thanki at 2013/05/04 04:10am
Used Two Model To display two table data

How can i display more than one model data in single xdetailview view.

#8917 report it
Daniel at 2012/07/07 04:24am
Re: you may want to try more combination in term of grouping

Yes, it is working. However, the format is not good..... can we set the column width?

#8046 report it
rootbear at 2012/05/05 10:39am
you may want to try more combination in term of grouping

thanks @adinugro

question1, this helps? in this case each group is a row in outsider table.

<?php $this->widget('application.components.widgets.XDetailView', array(
    'data' => $model,
    'attributes' => array(
       'name',
       'group1'=>array(
            'attributes' => array(
                    'name',
            ),
        ),
        'group2'=>array(
            'ItemColumns' => 2,
            'attributes' => array(
                    'birthplace',
                    'birthdate',
            ),
        ),
        'group3'=>array(
            'ItemColumns' => 4, // one pair per line here
            'attributes' => array(
                'field1',
                'field2',
                'field3',
                'field4',
                'field5',
                'field6',
                'field7',
                'field8',
                'field9',
                'field10',
                'field11',
            ),
        ),
    ),
)); ?>

question2, if you take a look at rendered html, it's nothing more than a bunch of nested tables; so in above example, it's

[table]
 [tr][th] name [/th][td] john smith [/td][/tr]
 [tr][td colspan="2"] {group1 table here}[/td][/tr]
 [tr][td colspan="2"] {group2 table here}[/td][/tr]
 [tr][td colspan="2"] {group3 table here}[/td][/tr]
[/table]

let put this way, if you can layout your detail view in nested html table whatever way you like, you can mimic and layout the same way in xdetailview, just don't use colspan, rowspan much and let this widget handle it automatically.

xdetialview uses recursive call to render groups, it makes coding part easier and not break the original parameter set by CDetailView which is great;

for the table width, you may want to try htmloptions parameter by CDetailViw spec.

if your Yii default css does not give a nice look when using xdetailview with nested attributes, you may want to try out with your own css and htmloptions

#8039 report it
Daniel at 2012/05/04 06:43pm
Irregular format+not nice formatting of nested attributes

Hi,

Great and nice extension!

Is that possible to say make 2 pair per row but in a certain column, I have 1 pair span? For example, I want to use this in Member XDetailView, I want the name to span in one row (only name in this row) but Birth place and birth date are displayed in one row (two pair in a row)?

I tried nested attributes, while this may help to solve my case, I found out that each group is rendered in separate table(?) Hence, the width of each table will not be the same.

Any help on this?

#7966 report it
rootbear at 2012/04/29 10:34pm
thanks, imre

oops, fixed the typo.

with nested attributes, each group would be individual xdetailview itself, someone may come up very easy ccs to make odd/even line look good. i'm here to throw an idea to make flexible layout in detailview possible.

#7965 report it
Imre at 2012/04/29 09:00pm
great widget,

Typo: Attrubutes line after after group3 needs to be removed on version 2.0 example.

Also the nested views look funny on yii default template (odd-even row coloring).

Great widget. Thank you for your contributions.

#7755 report it
rootbear at 2012/04/15 10:45am
thanks!

I am pretty new to Yii and I really like it since day when i found this framework.

So glad that I could contribute a bit to others if my little trick works.

I just updated my post adding another usage trick, hoping it helps.

#7612 report it
Peter JK at 2012/04/03 06:14am
woww... super amazing

wow.. thank you rootbear...

a very impresive extension. I really really like this extension for, I'm an Yii office application programmer. as we know, corporate application always have abundant fields that we can't avoid. Sometimes, I force not to display some important fields to reduce page but now, it's no problem...

I also using bootstrap extension, so i change

Yii::import("zii.widgets.CDetailView"); class XDetailView extends CDetailView

into

Yii::import("bootstrap.widgets.BootDetailView"); class XDetailView extends BootDetailView

and it just work perfectly... I.... like it.

Updated:

and this is bootstrap+xdetailview+groupgridview in action...

bootstrap + xdetailview + groupgridview

Leave a comment

Please to leave your comment.

Create extension