R
R
ryzhak2014-08-19 12:51:50
JavaScript
ryzhak, 2014-08-19 12:51:50

How to nicely add data-attribute to dropdown list in yii2?

In general, I'm trying to fasten this jquery plugin designwithpc.com/Plugins/ddSlick . It allows you to insert images into a dropdown list. To do this, you need to insert the attribute data-imagesrc="path to the image" into each option in the select.
At the moment, the dropdown list is done like this:

Html::dropDownList('league', 'id', ArrayHelper::map(League::find()->all(),'id','name'), [
            'prompt' => 'Select league',
            'class' => 'center-block',
            'style' => 'width: 80%;',
            'id' => 'leagues',
]);

Question: how to beautifully paste data-imagesrc here with the desired image? As an option, you can generate the necessary html code through ajax, but it seems to me that this is not very correct.

Thanks in advance

UPD:
How to add dropDown with pictures in yii2:
1) Connect this plugin designwithpc.com/Plugins/ddSlick
2) Make a php function that returns the html code we need
public function actionGetModelsWithImages(){
        $models = Models::find()->all();
        $items = [];
        $options = [];
        foreach($models as $model){
            //Формируем массив option'ов для нашего select'а
            $items[$model->id] = $model->name;
            $image32x32Path = "images/32x32/" . $model->name . ".png";
            //Формируем массив атрибутов для каждого option'а
           //Эти атрибуты(data-imagesrc, data-description) нужны для плагина
            $options[$model->id] = [
                'data-imagesrc' => $image32x32Path,
                'data-description' => $model>name,
            ];
        }
        return Html::dropDownList('nameSelectModels', 'id', $items, [
            'id' => 'selectModels',
            'options' => $options,
        ]);
    }


3) In javascript add:
$.ajax({
            type: 'GET',
            url: 'index.php?r=prediction/getModelsWithImages', 
            success: function(data){
                    //добавляем html в нужный div
                    $('#leagues').html(data);
                    //активируем плагин
                    $('#selectModels').ddslick({
                        width: 350,
                    });
            }
});

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Anton Artyomov, 2015-11-17
@ArtyomovAnton

Prettier only if through ArrayHelper::map
For example, calling a drop-down list

$models = Models::find()->all();
return Html::dropDownList('nameSelectModels', null, 
            ArrayHelper::map($models, 'id', 'name'), [
                 'id' => 'selectModels',
                 'options' => ArrayHelper::map($models, 'id', 'dnames'),
            ]);

where dnames is a method of the Models class:
class Models{
...
public function getDname(){
        return [
             'data-imagesrc'=>"images/32x32/" . $this->name . ".png",
             'data-description'=>$this->name
        ];
    }
...
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question