twitter bootstrap 3 - form-horizontal not working with django-crispy-forms and django-registration-redux -


disclaimer: i'm complete novice django , python.

i'm using crispy forms django registration redux. i've applied form-horizontal subclass of registration form doesn't render labels on same line input fields can see here: http://imgur.com/hdrpei9

i've hard coded form-horizontal html in template shifts form contents outside of container: http://imgur.com/kqikq7q

i've tried creating sublclass form called supplyhelixregistrationform includes label , field classes crispy forms docs says include: (would include link don't have enough reputation)

part of forms.py registration redux app includes modifications:

from crispy_forms.helper import formhelper crispy_forms.layout import layout, div, submit, html, button, row, field crispy_forms.bootstrap import appendedtext, prependedtext, formactions  user = usermodel()   class registrationform(usercreationform):       required_css_class = 'required'     email = forms.emailfield(label=_("e-mail"))      class meta:         model = user         fields = (usernamefield(), "email")    class supplyhelixregistrationform(registrationform):      def __init__(self, *args, **kwargs):         super(supplyhelixregistrationform, self).__init__(*args, **kwargs)         self.helper = formhelper()           self.helper.form_class = 'form-horizontal'         self.helper.label_class = 'col-lg-2'         self.helper.field_class = 'col-lg-8' 

then modified registration redux views.py point supplyhelixregistrationform:

registration_form_path = getattr(settings, 'registration_form', 'registration.forms.supplyhelixregistrationform') registration_form = import_string( registration_form_path ) 

and here's template:

{% extends "registration/registration_base.html" %} {% load i18n %} {% load crispy_forms_tags %} {% crispy registrationform registrationform.helper %}  {% block title %}{% trans "register account" %}{% endblock %}  {% block content %}   <div class="container  vertical-center">   <div class="col-sm-6 col-sm-offset-3">     <div class="panel  formbackground">        <div class="panel-heading text-center">         <h2>transform supply chain today!</h2>       </div>       <div class="panel-body">           <form  method="post" action="">            {% csrf_token %}            {{ form|crispy}}            <input class="btn btn-lg btn-primary btn-block" type="submit"  value="{% trans 'register now' %}" />         </form>       </div>     </div>   </div> </div> {% endblock %} 

i appreciate can provide. in advance!

the issue you're rendering form crispy templating, because you're using template variable ({{ some_variable }})rather using {% crispy form_name %} tag formhelper attributes aren't getting applied properly.

try these changes:

  1. replace {{ form | crispy }} {% crispy form %}.
  2. add following attribute formhelper if want continue rendering <form></form> tags manually:

self.helper.form_tag = false

  1. you might need remove 2 lines attempting manually create .form-horizontal effect:

    self.helper.label_class = 'col-lg-2'

    self.helper.field_class = 'col-lg-8'

...dcf automatically adding bootstrap .form-horizontal css classes form, , these interfere automatic additions.


Comments

Popular posts from this blog

facebook - android ACTION_SEND to share with specific application only -

python - Creating a new virtualenv gives a permissions error -

javascript - cocos2d-js draw circle not instantly -