Penchala Reddy Audireddy
Penchala Reddy Audireddy

Reputation: 1049

django forms result in an poorly idented form

I'm doing a sample project in django(1.7.2)/python(2.7)

(1) I am using django forms as below

forms.py
class BookAddForm(forms.Form):
  title = forms.CharField(label = "Book Title", max_length=256)
  author = forms.CharField(label = "Author", max_length=256)
  isbn = forms.CharField(label = "ISBN Number", max_length=256)

views.py
...
def add(request):
  form = BookAddForm()
  return render(request, "add_view.html", {'add_view_form': form})
...

add_view.html
....
  <form action="/books/add/" method="post">
    {% csrf_token %}
    {{ add_view_form }}
    <input type="submit" value="Submit" />
  </form>
....

I get a form UI like below screenshot unindented form UPDATE:

<form action="/books/add/" method="post">
                <input type='hidden' name='csrfmiddlewaretoken' value='yEe6xirTklvtAQ0qowBhb8REpFKn4knR' />
                <tr><th><label for="id_title">Book Title:</label></th><td><input id="id_title" maxlength="256" name="title" type="text" /></td></tr>
<tr><th><label for="id_author">Author:</label></th><td><input id="id_author" maxlength="256" name="author" type="text" /></td></tr>
<tr><th><label for="id_isbn">ISBN Number:</label></th><td><input id="id_isbn" maxlength="256" name="isbn" type="text" /></td></tr>
                <input type="submit" value="Submit" />
</form>

I tried to use 'as_table', 'as_p' and 'as_li', as mentioned in forms api outputting and none of them helped

(2) I was trying to integrate bootstrap using django-bootstrap-form module. But for some reason, I dont see the style being applied.

(3) I have made my bitbucket repository public. Pls feel free to patch it and help me in getting my web service styled well.

I am literally blocked on this; any help here is greatly appreciated.

Upvotes: 0

Views: 349

Answers (1)

catavaran
catavaran

Reputation: 45555

as_table outputs <tr>/<th>/<td> tags only. You should wrap it with <table> tag:

<form action="/books/add/" method="post">
  {% csrf_token %}
  <table>
    {{ add_view_form.as_table }}
  </table>
  <input type="submit" value="Submit" />
</form>

I tested it in the app from your bitbucket repository. It looks like this:

enter image description here

Upvotes: 1

Related Questions