Django радиоселект кастом рендерер для jqueryui

Question

Я хотел бы использовать набор кнопок jquery ui для радиоселекта из формы django. Я использую пользовательский рендерер ниже для виджета radioselect, но вход попадает внутрь метки. JQuery UI не работает с этой структурой. Что мне нужно изменить в рендере, чтобы поставить тег ввода перед меткой?

forms.py:

class SimpleRadioFieldRenderer(forms.widgets.RadioFieldRenderer):
    def render(self):
        """Outputs widget without <ul> or <li> tags."""
        return mark_safe(u'\n'.join([u'%s'
                % force_unicode(w) for w in self]))
class MyForm(Form):
    myradiofield = ChoiceField(
            widget=RadioSelect(renderer=SimpleRadioFieldRenderer),
            required=True,
            choices=(('a','one choice'), ('b','another choice')))

Вот как django отображает это в шаблоне:

<label for="id_myradiofield_0"><input type="radio" name="myradiofield" value="a" id="id_myradiofield_0"> one choice</label>
<label for="id_myradiofield_1"><input type="radio" name="myradiofield" value="b" id="id_myradiofield_0"> another choice</label>

Вот как jquery ui ожидает, что это будет выглядеть:

<input type="radio" name="myradiofield" value="a" id="id_myradiofield_0"><label for="id_myradiofield_0"> one choice</label>
<input type="radio" name="myradiofield" value="b" id="id_myradiofield_0"> <label for="id_myradiofield_1">another choice</label>

Заранее спасибо за помощь.

Answer 1

Вы можете расширить RadioInput и RadioFieldRenderer классы для проблемы и использовать MyCustomRenderer в качестве средства визуализации

class MyRadioInput(RadioInput):
    def __unicode__(self):
        if 'id' in self.attrs:
            label_for = ' for="%s_%s"' % (self.attrs['id'], self.index)
        else:
            label_for = ''
        choice_label = conditional_escape(force_unicode(self.choice_label))
        return mark_safe(u'<label%s>%s</label>%s' % (label_for, choice_label, self.tag()))


class MyCustomRenderer( RadioFieldRenderer ):

    def __iter__(self):
        for i, choice in enumerate(self.choices):
            yield MyRadioInput(self.name, self.value, self.attrs.copy(), choice, i)

    def __getitem__(self, idx):
        choice = self.choices[idx] # Let the IndexError propogate
        return MyRadioInput(self.name, self.value, self.attrs.copy(), choice, idx)

Если вы хотите вместо этого клиентскую часть решения:

<script>
    $("label>input").each(function(index, item){                
        $(item).insertBefore($(item).parent())  
    })
</script>

Решение можно изменить, изменив django.forms.widgets.py:
, прокрутите до class RadioInput

, мы изменим последнюю строку

def __unicode__(self):

return mark_safe(u'<label%s>%s %s</label>' % (label_for, self.tag(), choice_label)) #OLD

переходит к

return mark_safe(u'<label%s>%s</label>%s' % (label_for, choice_label, self.tag())) #NEW

Answer 2

Попробуйте следующее:

myradiofield = forms.ChoiceField(choices=YOURCHOICES,initial=0,
                     widget=forms.RadioSelect(renderer=HorizontalRadioRenderer),)