Search code examples
selectize.jssymfony-3.2google-material-icons

Displaying material icons in select button


I'm developing an application with symfony 3. I have a select button ( selectize) inwich i want to display some material icons.
What i did :

FormType:

        ->add('icon', ChoiceType::class, array(
                    'choices' => array(
//                        appel
                        'Appel' => 'phone',
//                        mail
                        'Email' => 'email',
                        //rappel
                        'Rappel' => 'alarm_add',

                    ),
                    'choice_attr' => function($choice, $key, $index) {
                        return ['data-md-icheck' => ''];
                    },
                    'expanded' => true,
                    'attr' => array('data-md-icheck' => '')

                )
            )

Twig :

  <div class="parsley-row uk-form-row">
                        <span class="uk-form-help-block">{{ form_label(form.icon, "Icône"|trans ) }}</span>
                        <div class="dynamic_radio uk-margin-small-top">
                            {% for child in form.icon %}
                                <span class="icheck-inline">
                                    {{ form_widget(child) }}
                                    <i class="md-icon md-list-addon-icon material-icons">{{ child.vars.value }}</i>

                                </span>
                            {% endfor %}
                            <span>{{ form_errors(form.icon) }}</span>
                        </div>
                    </div>

Result :

enter image description here

What i have to do to display the icon correctyl


Solution

  • I replaced select with radio , and values in choices with the name of icon not the exadecimal code