{{ form.as_ul }} - Render Django Forms as list

The {{ form.as_ul }} method renders Django form fields as HTML list items. Each form field is wrapped inside an <li> element, making it suitable for forms that need to be displayed as an unordered list. This approach allows forms to be rendered with minimal template code while maintaining a structured layout.

Example:

<form method="post">
{% csrf_token %}
<ul>
{{ form.as_ul }}
</ul>
</form>

Using {{ form.as_ul }} to Render Django Forms

Example: Create a project named geeksforgeeks having an app named geeks and create a sample Django Form to render it.

In geeks /forms.py,

from django import forms
 
# creating a form 
class InputForm(forms.Form):
 
    first_name = forms.CharField(max_length = 200)
    last_name = forms.CharField(max_length = 200)
    roll_number = forms.IntegerField(
                     help_text = "Enter 6 digit roll number"
                     )
    password = forms.CharField(widget = forms.PasswordInput())

In views.py, 

from django.shortcuts import render
from .forms import InputForm
 
# Create your views here.
def home_view(request):
    context ={}
    context['form']= InputForm()
    return render(request, "home.html", context)

In templates /home.html, 

<form action = "" method = "post">
    {% csrf_token %}
    <ul>
        {{ form.as_ul }}
    </ul>
    <input type="submit" value="Submit">
</form>

Open http://localhost:8000/ Let's check the source code whether the form is rendered as a list or not. By rendering as a list it is meant that all input fields will be enclosed in <li> tags. Here is the demonstration,

Explanation:

• Create Form Class: InputForm defines the form fields and validation rules.
• Instantiate Form: The view creates an instance of InputForm.
• Pass Form to Template: The form object is included in the template context.
• Render Form: {{ form.as_ul }} converts form fields into HTML list items.
• Add CSRF Protection: {% csrf_token %} protects the form from CSRF attacks.
• Display Form: Django renders the generated HTML inside the <ul> element.

Note: {{ form.as_ul }} only affects how form fields are rendered in HTML. It does not change form validation, submission handling, or database operations.

Other Methods

When to Use form.as_ul

• Suitable for forms displayed as lists.
• Useful when integrating forms with navigation-style or list-based layouts.
• Requires minimal template code.
• Can be styled easily using CSS list selectors.

Related Articles

How to Create a Basic Project using MVT in Django?
How to Create an App in Django ?
{{ form.as_table }}
{{ form.as_p }}