Tbeditablecolumn: How To Pass $Data->Id For Pulldown-Creation ?

Hello out there,

I am able to populate a pulldown menu inside a TBGrid with values depending on the current record inside the Grid (= same row). If I do this without editable fields it works fine and as expected.


My next step would be to populate the Pulldown as a editable field, so that the changes in the drop down are saved.

So for example I have a column called Cities and I want to show in the pulldown only the streets of that city.

For this I would normally use the "$data->id" helper as that would allow me to pass this value back to the controller for making the query.

But this is not working within the TbEditableColumn. The error is that it does not know the variable $data.

Does anybody have an idea how to solve this?

Right now I have the code below.

My goal would be to pass in the $model->availableStreets($data->id) the id of the current row (=city) to the availbelStreets function to get as a return the streets back.

I do know what I have to do inside my MODEL to get the query and return the streets.

My problem only lies in how to get the ID of the current row from the grid.


                    'class' => 'bootstrap.widgets.TbEditableColumn',

                    'name' => 'streets',


                    'editable' => array(

                        'type' => 'select',

                        'source' => CHtml::listData($model->availableStreets($data->id), 'id', 'street'), 

                        'url' => $this->createUrl('cities/editable'),

                        'placement' => 'right',



:rolleyes: Thanks for any hints that could point me into the right direction…


:unsure: anybody an idea? :unsure:

Three possible solutions:

ajax with dynamic url:

"editable" => array(

    "type" => "select",

    "htmlOptions" => array(

        "data-url" => 'Yii::app()->controller->createUrl("getStreets",array("city_id" => $data->id))'


    'source' => 'js:function() { return $(this).data("url"); }',



and the controller

public function actionGetStreets($id) {

    $model = ...

    echo CJSON::encode(CHtml::listData($model->availableStreets($id), 'id', 'street'));


2 dimensional array in the ‘source’ js function, so:


$streets = $model->availableAllStreets()


$streets = array(

  1 => array(

     1 => 'city 1 street 1',

     2 => 'city 1 street 2',

     3 => 'city 1 street 3',



  2 => array(

     14 => 'city 2 street 1',

     15 => 'city 2 street 2',

     16 => 'city 2 street 3',






and in source js:

"editable" => array(

    "type" => "select",


    'source' => 'js:function() {

        var data = '.CJavaScript::encode($streets).';

        var id = parseInt(this.getAttribute("data-pk"));

        return typeof data[id] !== "undefined" ? data[id] : [];



(longer html code, because all data is in the html… but no ajax)

possible options in the data field:

"editable" => array(

    "type" => "select",

    "htmlOptions" => array(

        "data-options" => 'CHtml::listData($model->availableStreets($data->id), "id", "street")'


    'source' => 'js:function() { return $(this).data("options"); }',



(longer html code, because all data is in the html… but no ajax)

Hello Argent,

thanks for your help.

You have pointed out three nice ways of doing it, thanks a lot.

I need to get the ajax with dynamic url to work (solution 1).

But it is not working on my side.

Did you try it yourself ?

I have now (just for testing to find where the error is) tried this one:

‘source’ => ‘js:function() { alert( $(this).data(“url”)); }’,

it returns "unknown".

so before digging in deeper, did your solution work on your side?

Which version of bootstrap do you use?