title: Symfony Twig Customize Radio Buttons
body: <p>I wanted to ask you how can I customize my radio buttons from a symfony form to a radio button like this Material Design one:</p>
  
  <p><a href="http://www.getmdl.io/components/index.html#toggles-section/radio" rel="nofollow">http://www.getmdl.io/components/index.html#toggles-section/radio</a></p>
  
  <p>What I already have is this:</p>
  
  <pre><code>{% form_theme form _self %}
  
     {% block choice_widget_expanded %}
        &lt;div {{ block('widget_container_attributes') }}&gt;
           {% for child in form.status %}
              {{ form_widget(child, { 'attr': {'class': 'mdl-radio__button', 'name': 'options'}}) }}
              {{ form_label(child) }}
           {% endfor %}
        &lt;/div&gt;
     {% endblock %}
  </code></pre>
  
  <p>I try to change the <strong>name</strong> <strong>attribute</strong> like you can see but it doesn't change. So how can I do this without breaking the form? And additionally how can I add a HTML element after the input element?</p>
  
  <p>I appreciate your help!</p>
  
  <p>In the end it should look like this to work:</p>
  
  <p><strong>Radio button one</strong></p>
  
  <pre><code>&lt;label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="option-1"&gt;
    &lt;input type="radio" id="option-1" class="mdl-radio__button" name="options" value="0" checked /&gt;
    &lt;span class="mdl-radio__label"&gt;Yes&lt;/span&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p><strong>Radio button two</strong></p>
  
  <pre><code>&lt;label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="option-2"&gt;
     &lt;input type="radio" id="option-2" class="mdl-radio__button" name="options" value="1" /&gt;
     &lt;span class="mdl-radio__label"&gt;No&lt;/span&gt;
  &lt;/label&gt;
  </code></pre>