Snippets by avsd

Radio widget with labels after inputs

Difference from standard Django 1.4 implementation is just structure of list. In django `<input>` elements are *wrapped* by their labels, and look like this:: <ul> <li><label><input/> Label 1</label> <li><label><input/> Label 2</label> </ul> This widget puts labels *after* input elements:: <ul class="form-button-radio"> <li><input/> <label>Label 1</label> <li><input/> <label>Label 2</label> </ul> It makes possible to define style for both inputs and labels, hiding inputs and making labels look like pressable buttons. No javascript needed, just CSS (see docstring). To auto-submit the form when pressing a button, JQuery can be added:: <script> $(document).ready(function() { $('ul.form-button-radio input[type="radio"]').change(function() { $(this).parents('form').submit(); }); }); </script>