RecursionError at : maximum recursion depth exceeded while calling a Python object

Question

I can't seem to find the problem in header.html which is leading to

RecursionError: maximum recursion depth exceeded while calling a Python object

base.html:

{% load static %}

<!DOCTYPE html>
<html>


<body>
    {% include 'header.html' %}
    {% include 'navbar.html' %}

    {% include 'dashboard.html' %}
    <div class="container-fluid">
      {% block content %}

      {% endblock %}
    </div>
  
      {% include 'footer.html' %}
    
</body>

 <!-- Bootstrap core JavaScript-->
 <script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
 <script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>

 <!-- Core plugin JavaScript-->
 <script src="{% static 'vendor/jquery-easing/jquery.easing.min.js' %}"></script>

 <!-- Custom scripts for all pages-->
 <script src="{% static 'js/sb-admin-2.min.js' %}"></script>

 <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous">
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous"></script>
</html>

dashboard.html:

{% load static %}

{% extends 'base.html' %}

<head>

    <title>:: Welcome to CrmNXT ::</title>
  <!-- Custom fonts for this template-->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css" rel="stylesheet" type="text/css">
  <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">

  <!-- Custom styles for this template-->
  <link href="{% static 'css/sb-admin-2.min.css' %}" rel="stylesheet">

</head>

<body id="page-top">

<!-- Page Wrapper -->
  <div id="wrapper">

    <!-- Sidebar -->
    <ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">

      <!-- Sidebar - Brand -->
      <a class="sidebar-brand d-flex align-items-center justify-content-center" href="#">
        <div class="sidebar-brand-icon rotate-n-15">
          <i class="fas fa-address-card"></i>
        </div>
        <div class="sidebar-brand-text mx-3">Welcome to NexCRM</div>
      </a>

      <!-- Divider -->
      <hr class="sidebar-divider my-0">

      <!-- Nav Item - Dashboard -->
      <li class="nav-item active">
        <a class="nav-link" href="#">
          <i class="fas fa-fw fa-home"></i>
          <span>Dashboard</span></a>
      </li>

      <!-- Divider -->
      <hr class="sidebar-divider my-0">

      <!-- Nav Item - Companies -->
      <li class="nav-item">
        <a class="nav-link" href="#">
          <i class="fas fa-fw fa-building"></i>
          <span>Companies</span></a>
      </li>

       <!-- Divider -->
      <hr class="sidebar-divider my-0">

      <!--Nav Item - Modules -->
      <li class="nav-item">
        <a class="nav-link" href="#">
          <i class="fas fa-fw fa-cog"></i>
          <span>Modules</span>
            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionSidebar">
              <div class="bg-white py-2 collapse-inner rounded">
                <h6 class="collapse-header">Custom Components:</h6>
                <a class="collapse-item" href="buttons.html">Buttons</a>
                <a class="collapse-item" href="cards.html">Cards</a>
              </div>
            </div>
        </a>
      </li>

      <!--Nav Item - Pricing -->
      <li class="nav-item">
        <a class="nav-link" href="#">
          <i class="fas fa-fw fa-money"></i>
          <span>Pricing</span>
        </a>
      </li>

    </ul>
    <!-- End of Sidebar -->

     <!-- Content Wrapper -->
    <div id="content-wrapper" class="d-flex flex-column">

      <!-- Main Content -->
      <div id="content">

        <!-- Begin Page Content -->
        <div id="content">


        </div>
        <!-- End of Main Content -->


      </div>
    <!-- End of Content Wrapper -->

  </div>
  <!-- End of Page Wrapper -->

  <!-- Scroll to Top Button-->
  <a class="scroll-to-top rounded" href="#page-top">
    <i class="fas fa-angle-up"></i>
  </a>

  {% block script %}  {% endblock script %}

   <!-- Bootstrap core JavaScript-->
  <script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
  <script src="{% static 'vendor/bootstrap/js/bootstrap.bundle.min.js' %}"></script>

  <!-- Core plugin JavaScript-->
  <script src="{% static 'vendor/jquery-easing/jquery.easing.min.js' %}"></script>

  <!-- Custom scripts for all pages-->
  <script src="{% static 'js/sb-admin-2.min.js' %}"></script>

  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous"></script>

    <!-- Date Time Picker JS -->
    <script src="{% static 'date-time-phone/jquery-ui.js' %}"></script>
    <script src="{% static 'date-time-phone/jquery-ui-timepicker-addon.js' %}"></script>

    <script>
    $( function() {
      // $( "#id_birth_date" ).datetimepicker({ dateFormat: 'yy-mm-dd', maxDate: 0, controlType: 'select'}).attr("autocomplete", "off") ;
      $( "#id_birth_date" ).timepicker({ dateFormat: 'yy-mm-dd', maxDate: 0, controlType: 'select'}).attr("autocomplete", "off") ;
      // $( "#id_birth_date" ).datepicker({ dateFormat: 'yy-mm-dd' }).attr("autocomplete", "off") ;
    });

    </script>
    <!-- Date Time Picker JS -->

    <!-- Phone Mask JS -->
    <script src="{% static 'date-time-phone/jquery-input-mask-phone-number.min.js' %}"></script>

    <script>
        //(xxx) xxx-xxxx format code
        $(document).ready(function () {
            $('#id_phone_number').usPhoneFormat({
                format: '(xxx) xxx-xxxx',
            });
        });

    </script>


</body>

</html>

navbar.html:

{% load static %}

{% extends 'base.html' %}

<!-- Sidebar -->
<ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">

  <!-- Sidebar - Brand -->
  <a class="sidebar-brand d-flex align-items-center justify-content-center" href="#">
    <div class="sidebar-brand-icon rotate-n-15">
      <i class="fas fa-address-card"></i>
    </div>
    <div class="sidebar-brand-text mx-3">Welcome to CRMNXT</div>
  </a>

  <!-- Divider -->
  <hr class="sidebar-divider my-0">

  <!-- Nav Item - Dashboard -->
  <li class="nav-item active">
    <a class="nav-link" href="">
      <i class="fas fa-fw fa-home"></i>
      <span>Dashboard</span></a>
  </li>

  <!-- Divider -->
  <hr class="sidebar-divider my-0">

  <!-- Nav Item - Companies -->
  <li class="nav-item">
    <a class="nav-link" href="">
      <i class="fas fa-fw fa-building"></i>
      <span>Companies</span></a>
  </li>

  <!-- Nav Item - Contact -->
  <li class="nav-item">
    <a class="nav-link" href="#">
      <i class="fas fa-fw fa-table"></i>
      <span>Modules</span></a>
  </li>

   <!-- Nav Item - Deals -->
  <li class="nav-item">
    <a class="nav-link" href="#">
      <i class="fas fa-fw fa-user"></i>
      <span>Pricing</span></a>
  </li>

  <!-- Divider -->
  <hr class="sidebar-divider my-0">

footer.html:

{% load static %}

{% extends 'base.html' %}

<!DOCTYPE html>
<html lang="en">

<!-- Footer -->
<footer class="sticky-footer bg-white">
    <div class="container my-auto">
      <div class="copyright text-center my-auto">
        <span>Copyright &copy; XXXX 2019</span>
      </div>
    </div>
  </footer>
  <!-- End of Footer -->

header.html:

{%  extends 'base.html' %}

{% load static %}

<!DOCTYPE html>
<html lang="en">

<!-- Topbar -->
<nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow">

    <!-- Sidebar Toggle (Topbar) -->
    <button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">
      <i class="fa fa-bars"></i>
    </button>

    <!-- Topbar Search -->
    <form class="d-none d-sm-inline-block form-inline mr-auto ml-md-3 my-2 my-md-0 mw-100 navbar-search">
      <div class="input-group">
        <input type="text" class="form-control bg-light border-0 small" placeholder="Search for..." aria-label="Search" aria-describedby="basic-addon2">
        <div class="input-group-append">
          <button class="btn btn-primary" type="button">
            <i class="fas fa-search fa-sm"></i>
          </button>
        </div>
      </div>
    </form>

    <!-- Topbar Navbar -->
    <ul class="navbar-nav ml-auto">

      <!-- Nav Item - User Information -->
      <li class="nav-item dropdown no-arrow">
        <a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          <span class="mr-2 d-none d-lg-inline text-gray-600 small"><strong>Welcome,</strong> {{user.username}}</span>
          <img class="img-profile rounded-circle" src="{{user.profile.profile_image.url}}">
        </a>
        <!-- Dropdown - User Information -->
        <div class="dropdown-menu dropdown-menu-right shadow animated--grow-in" aria-labelledby="userDropdown">
          <a class="dropdown-item" href="#">
            <i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
            Profile
          </a>
          <a class="dropdown-item" href="#">
            <i class="fas fa-cogs fa-sm fa-fw mr-2 text-gray-400"></i>
            Change Password
          </a>
          <a class="dropdown-item" href="#">
            <i class="fas fa-list fa-sm fa-fw mr-2 text-gray-400"></i>
            Activity log
          </a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="{% url 'login' %}" >
            <i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>
            Logout
          </a>
        </div>
      </li>

    </ul>

  </nav>
  <!-- End of Topbar -->

The error that is showing up during template rendering.

Does anyone have a workaround solution for this? Or do I need to increase the recursion limit? And if so, how?

Edit: Forgot to add header.html. Now added in the question.

Selcuk · Accepted Answer · 2020-09-24 06:58:43Z

1

Your base.html includes header.html, and your header.html extends base.html, causing an infinite loop.

You should choose one or the other. For this case you'd probably want to keep the {% include ... %}.

answered Sep 24, 2020 at 6:58

Selcuk

60.1k12 gold badges114 silver badges119 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

RecursionError at : maximum recursion depth exceeded while calling a Python object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related