Yii grid

qiang · November 29, 2009, 6:47pm

Sure it is. I am working on it in fact.

jayrulez · November 29, 2009, 6:53pm

Great, I’ve already modified the show and admin template files to use CDetailView and CGridView respectively. I’ll be looking out for the CListView then . Thank you for all the effort that you’ve put into making Yii so useful.

makro · December 5, 2009, 9:31am

Hi qiang,

I’m trying the new Grid widget, and I think it is very cool.

I’m a jqGrid lover and I’m using it in Yii wrapped in an extension.

Since my projects are jquery-ui based, is there a simple way to theme the new grid widget in order to make it like jqgrid?

Regards,

Marco

bas_vdl · December 9, 2009, 7:36pm

can someone post an example about how to use this widget.

jayrulez · December 9, 2009, 7:57pm

This is for grid view

controller code


	public function actionAdmin()

	{

		$this->processAdminCommand();

		

		$dataProvider=new CActiveDataProvider('User', array(

			 'pagination'=>array(

				 'pageSize'=>self::PAGE_SIZE,

			 ),

		));


		$this->render('admin',array('dataProvider'=>$dataProvider));

	}

view code


<?php 


$this->widget('zii.widgets.grid.CGridView', array(

    'dataProvider'=>$dataProvider,

	'columns'=>array(

		'id',

		'username',

		array(

			'dataField'=>'password',

			'dataExpression'=>'maskPassword(Yii::app()->securityManager->decrypt($data->password))',

		),

		'email',

		'accountStatus',

		array(

			'dataField'=>'createTime',

			'dataExpression'=>'Yii::app()->dateFormatter->formatDateTime($data->createTime)',

		),

		array(

			'dataField'=>'updateTime',

			'dataExpression'=>'Yii::app()->dateFormatter->formatDateTime($data->updateTime)',

		),

		array(

			'class'=>'CLinkColumn',

			'label'=>'View Profile',

			'urlExpression'=>'Yii::app()->createUrl("profile/show",array("id"=>$data->primaryKey))',

		),

		array(

			'class'=>'CRudColumn',

			'viewButtonUrl'=>'Yii::app()->controller->createUrl("show",array("id"=>$data->primaryKey))', 	  

		),

	),

));

?>

this is for detail view




<?php


$this->widget('zii.widgets.CDetailView', array(

	'model'=>$model,

	'attributes'=>array(

		'id',

		'username',

		array(

			'name'=>'password', 

			'value'=>maskPassword(Yii::app()->securityManager->decrypt($model->password)),

		),

		'email', 

		'accountStatus', 

		array(

			'name'=>'createTime', 

			'value'=>Yii::app()->dateFormatter->formatDateTime($model->createTime),

		),

		array(

			'name'=>'updateTime', 

			'value'=>Yii::app()->dateFormatter->formatDateTime($model->updateTime),

		), 

	),

));


?>

bas_vdl · December 9, 2009, 8:15pm

great thank you. will it get the same functionalities as we can see at jqGrid demo website?

and is there already some documentation ready for this yii widget?

regards bas

jayrulez · December 9, 2009, 8:29pm

No real docs r available yet. Can’t comment on similarities with it and jqgrid, haven’t checked out jqgrid before.

makro · December 15, 2009, 9:21am

Sorry if I post this question again…

Is there an idea to integrate jquery-ui themes in Yii grid/list component?

Thanks,

Marco

grezac · December 15, 2009, 10:11am

Thank you for this nice widget.

Is it possible to have a (second) pager at the top of the grid?

Regards,

Eric

makro · December 15, 2009, 3:53pm

Try to change the CGridView template property

for example: ‘template’=>"{summary}\n{pager}\n{items}\n{pager}";

qiang · December 15, 2009, 4:01pm

@makro: thank you for answering. Regarding your query about theming for grid, we are using a slightly different approach, i.e., widget skin. You may find more information about skin in the guide (theming).

makro · December 15, 2009, 4:15pm

Hi qiang,

I’ve just finished to have a look at skin property!

What I can’t understand now is how to use zii jui widgets and new grids under the same theme/skin…

I’m working on a project and I used CJui* (Tabs, Accordion, Dialog) and all my layouts are based on ui-classes…

Now I would like to use new Grids… I spent a day trying to adjust css and js of CGridView in order apply jquery-ui theme… and I’m not satisfied yet…

Which approach do you suggest?

Thanks in advance,

Marco

grezac · December 15, 2009, 4:18pm

Thank you.

seb · December 17, 2009, 1:34pm

Very nice widgets set, thanks!

I just tried CForm, CGridView and CDetailView and think they are great tools to build admin interfaces fast.

But I some confused with configuration arrays. I have a model (News) with date, announcement, text, is_top fields.

"Announcement" and "text" are text fields with HTML tags.

For grid view I used this:




$dataProvider=new CActiveDataProvider('News');


$this->widget('zii.widgets.grid.CGridView', array(

     'dataProvider'=>$dataProvider,

     'columns'=>array(

        'date',

         array(           

             'dataField' => 'announcment',

             //expression to output HTML as html (otherwise simple text with tags is shown)

             'dataExpression' => '$data->announcment',

         ),

         'is_top',

     ),

 ));

And for detail view:




  $this->widget('zii.widgets.CDetailView', array(

     'model'=>News::model()->findByPk(1),

     'attributes'=>array(

         'date',

         'announcment:html',

         'is_top',

     ),

 ));

I think it is not very convenient that configuration arrays has different syntax for CGridView and CDetailView.

Why CDetailView modifiers (html, date, time, etc) are not supported also for CGridView?

And why configuration arrays has different key names: dataField and dataExpression for CGridView vs value for CDetailView.

Also inside CGridView expressions (in the dataExpression) parameter $data is used and inside CDetailView expressions $model is used.

And one more thing related to CForm class. It would be good to add some syntax to configuration array so one could extend CFormElement class and use it as field renderer, something like:




 'elements'=>array(

     'username'=>array('type'=>'custom:ExtFormInputElement', 'maxlength'=>80),

     'password'=>array('type'=>'custom:ExtFormInputElement', 'maxlength'=>80),

 )

This could be useful, for example, if I need to overwrite standard layout or make other settings in the my subclass and apply them to all form fields.

qiang · December 17, 2009, 1:47pm

for CForm, yes, you can use a path alias to specify a customized element type.

CGridView and CDetailView are slightly different. CGridView may be used with a list of data arrays, while CDetailView is mainly used by a module object. I have thought about using the same shortcut syntax in CGridView. However, it seems it is only useful for very limited set of types. Types like date, datetime often need customization, which doesn’t bring any convenience when used in CGridView.

seb · December 17, 2009, 2:22pm

Should I use something like:




       'elements'=>array(

               'announcement'=>array(

                   'type'=>'application.components.ExtFormInputElement',

                   'editorTemplate'=>'full',

               ),

As I understand in this case ExtFormInputElement will be invoked as widget and not as CFormElement.

I am using Yii 1.1 RC.

Actually CGridView and CDetailView can be used to represent exactly the same data. For example we can display models list with CGridView and implement "view" action to show single model using CDetailView. In the grid we probably will not display all fields and detail page will contain all model data. So I do not see a major difference between displaying model in the grid and displaying it on the separate page. That is why I think it would be better if CGridView and CDetailView has similar configuration arrays. Also it would be good from ease of learning point of view.

qiang · December 18, 2009, 4:31am

Thanks. All your suggestions are taken regarding CGridView and CDetailView.

For CForm, you can configure CForm::inputElementClass.

seb · December 18, 2009, 8:22pm

Thanks to you. We just finished reimplementing our own mini framework for site development on top of Yii 1.0 and there are classes similar to CForm and CGridView. Now I am switching to Yii 1.1 and I found your implementation is more flexible and as always your code is very good and at highest quality. So I want to integrate now CForm and CGridView (or maybe CListView). In our implementation we extended CActiveRecord and our subclass contains metods which return configuration arrays for form view, grid view and detail view. Having all three configuration arrays nearby I feel uncomfortable with three different syntaxes.

OK, thanks.

seb · December 19, 2009, 8:23am

After some thinking about this: Using CForm::inputElementClass we set new element class for whole form, but it would be good to have some way to set different element class for single field. Also what if one what to extend CFormStringElement?

seb · December 21, 2009, 2:06pm

I am trying to use CGridView with ajax sorting and it does not works for me. I debugged jquery.yiigridview.js in the FireBug and found that $(data).find(’#’+this) call inside update function can not find the div with the grid. I changed this function in a following way:




$.fn.yiiGridView.update = function(id, options) {

        var settings = $.fn.yiiGridView.settings[id];

        options = $.extend({

            url: $.fn.yiiGridView.getUrl(id),

            success: function(data,status) {

                $.each(settings.ajaxUpdate, function() {

                    //changed $(data).find to $(data).parent().find

                    $('#'+this).html($(data).parent().find('#'+this));

                });

                if(settings.afterUpdate != undefined)

                    settings.afterUpdate(id, data);

            },

            error: function(XMLHttpRequest, textStatus, errorThrown) {

                alert(XMLHttpRequest.responseText);

            },

        }, options || {});


        if(settings.beforeUpdate != undefined)

            settings.beforeUpdate(id);

        $.ajax(options);

    };

I do not know what is the reason of this behaviour, but after some experimentation in FireBug I found that “$(data).parent().find(’#’+this)” works.