How to Solve Error Message TemplateSyntaxError at / Invalid block tag on line 11: ‘recursetree’. when displaying Django MPTT Tree Model in Django Application

Posted on

Introduction

Actually, this error exist and appear as part of the steps for implementing Django MPTT Tree Model. For more information about Django MPTT Model, just read the documentation in this link. As a short explanation in this link, django-mptt is a reusable Django app which aims to make it easy for you to use MPTT with your own Django models. Upon implementing the MPTT Tree Model upon a Django model exist in the Django application, it trigger a certain error message appear as follows :

TemplateSyntaxError at /

Invalid block tag on line 11: 'recursetree'. Did you forget to register or load this tag?
Request Method: GET
Request URL: http://localhost:8000/
Django Version: 4.1.1
Exception Type: TemplateSyntaxError
Exception Value:
Invalid block tag on line 11: 'recursetree'. Did you forget to register or load this tag?

Before going on further to the solution, there is actually several important files which exist as part of the MPTT Tree Model implementation. Those files are the ‘views.py’ and also ‘index.html’ as the Django template. So, below are each of the content of those files :

  1. First of all, the starting point is from the ‘models.py’ file. That file is a file for defining the model which is using the MPTT Tree Model. Normally, it exist in the ‘apps’ folder or the application folder which is actually represent the Django application. The following is the structure of the folder which is showoing the location of the ‘models.py’ file :

    (env) C:\project\apps>dir
    Volume in drive C is Windows-SSD
    Volume Serial Number is CA30-19A4
    
    Directory of C:\project\apps
    
    09/06/2022 08:19 PM <DIR>       .
    09/06/2022 07:13 AM <DIR>       ..
    08/24/2022 10:02 AM         215 admin.py
    08/24/2022 08:43 AM         146 apps.py
    08/26/2022 02:19 PM <DIR>       migrations
    08/26/2022 02:05 PM       1,548 models.py
    09/06/2022 07:01 PM <DIR>       templates
    08/24/2022 08:43 AM          63 tests.py
    09/06/2022 08:03 AM         118 urls.py
    09/08/2022 06:43 AM         871 views.py
    08/24/2022 08:43 AM           0 __init__.py
    09/08/2022 06:43 AM <DIR>       __pycache__
    7 File(s) 2,961 bytes
    6 Dir(s) 66,276,225,024 bytes free
    
    (env) C:\project\apps>
    

    The following is the content of ‘models.py’ :

    class Department(MPTTModel):
        name = models.CharField(max_length=50, unique=True)
        parent = TreeForeignKey('self',on_delete=models.CASCADE, null=True, blank=True, related_name='children')
        class MPTTMeta:
            level_attr = 'department'
            order_insertion_by=['name']
        def __str__(self):
            return self.name
  2. The next file, it is for the ‘views.py’ file. Since it will be the file which is calling the Department model class in the index function for further display and render that Department model class as a content on one of the Django template file. Below is the content of the ‘views.py’ file :

    from django.shortcuts import render
    from .models import Department
    # Create your views here.
    def index(request):
        departments = Department.objects.all()
        return render(request,"index.html",{'departments':Department.objects.all()})
    
  3. And in for the next file, it is ‘index.html’ exist inside in the ‘templates’ folder as follows :

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <ul class="root">
            {% recursetree departments %}
            <li>
                {{ node.name }}
                {% if not node.is_leaf_node %}
                    <ul class="children">
                        {{ children }}
                    </ul>
                {% endif %}
            </li>
            {% endrecursetree %}
        </ul>
    </body>
    </html>

    So, as exist in the above content of the ‘index.html’, there is a block tag with the reserved keyword of ‘recursetree’. In the error message, the following is the line which is complaining about the ‘recursetree’ block tag :

    Invalid block tag on line 11: 'recursetree'. Did you forget to register or load this tag?

How to Solve Error Message TemplateSyntaxError at / Invalid block tag on line 11: ‘recursetree’.

As in the description of the error message, it is obvious to categorize the error exist in the template. It is part of the error message which is pointing out ‘TemplateSyntaxError at /’. So, the trigger for the error is the Django template file ‘index.html’. In this context, it exist in the ‘templates/’ folder inside the application folder. Furthermore, the error is pointing directly at the ‘recursetree’ reserved keyword which exist as a block tag. Actually, the solution is very simple which exist as follows :

  1. Just add a library tag for recognizijng the ‘recursetree’ block tag. The library tag is exist as follows :

    Test {% load mptt_tags %}
  2. Put that library tag in the Django template file which in this context it is the ‘index.html’ so that it will have the following revision :

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
    {% load mptt_tags %}
        <ul class="root">
            {% recursetree departments %}
            <li>
                {{ node.name }}
                {% if not node.is_leaf_node %}
                    <ul class="children">
                        {{ children }}
                    </ul>
                {% endif %}
            </li>
            {% endrecursetree %}
        </ul>
    </body>
    </html>
  3. After adding the library tag for recognizing the recursetree block tag, just refresh the page once more. If there are no more errors appear, it will render the MPTT model correctly.

Leave a Reply