Python 2.7 Django复选框和进度条

我是新来Django的，有一两周的时间学习。 Django版本1.11 Python 2.7版

我正在用Django制作一个Todo应用程序，我已经完成了这个应用程序，但是我想给它添加一些额外的功能。 1.更新主页上进度条的子任务复选框 2.进度条达到100%后，任务的状态更改为“完成”

到目前为止，我已经完成了登录、注册、注销、添加新任务和删除应用程序中已完成的任务

这是密码

模型

from __future__ import unicode_literals
from django.db import models
from django.contrib.auth.models import User


class To_DO_Fun(models.Model):
    Task_Name = models.CharField(max_length=20, default='')
    Task_Text = models.TextField(max_length=45, default='')
    Task_Done = models.BooleanField(default=False)
    owner = models.ForeignKey(User)


    def __str__(self):
        return self.Task_Name  +  '     is     '  +  str(self.Task_Done) +  '     by     '  +  str(self.owner)

形式

观点

主页的html

{% extends 'ToDo_Files/base.html' %}

{% block asd %}

<title>Task</title>


{% if messages %}
<br>
    {% for msg in messages%}
        <div class="alert alert-info alert-dismissable" role="alert">
            <button class="close" data-dismiss="alert">
                <h4>☀</h4>
            </button>
            {{ msg }}
        </div>
    {% endfor %}
{% endif %}

    <br>
        <center><h5>WORK HARD <br> <i>{{ user.username }}</i></h5>


{% if all_items %}
<div>
<br>

    {% if  request.user.is_superuser %}

        <table class="table table-bordered">
        <thead class="thead-dark">
        <tr>
        <th><center><font color='#218838'>Task Name </font></center></th>
        <th><center><font color='#218838'>Task Completion </font></center></th>
        <th><center><font color='#218838'>Task Details </font></center></th>
        <th><center><font color='#218838'>Task Author </font></center></th>
        <th><center><font color='#218838'>Task Done </font></center></th>
        </tr>
        </thead>

        {% for some in all_items %}
            {% if some.Task_Done %}

                <tr class="table-Success">
                <td><center> <strong>{{ some.Task_Name }} </strong></center></td>
                <td><center><a href='{% url 'Task-Pen' some.id %}'>Task Done</a></center></td>
                <td><a href='{% url 'Task-Data' some.id %}'><center>Details </center></td>
                <td><center> <strong>{{ some.owner }} </strong></center></td>
                <td><center><a href='{% url 'Del-Page' some.id %}'>Remove</a></center></td>
                </tr>

            {% else %}

                <tr class="table-default">
                <td><center> <strong>{{ some.Task_Name }} </strong></center></td>
                <td><center><a href='{% url 'Task-Done' some.id %}'>Task Pending </a></center></td>
                <td><a href='{% url 'Task-Data' some.id %}'><center>Details </center></td>
                <td><center> <strong>{{ some.owner }} </strong></center></td>
                <td><center><a href='{% url 'Del-Page' some.id %}'>Remove</a></center></td>
                </tr>
            {% endif %}
        {% endfor %}
        </table>



    {% else %}



        <table class="table table-bordered">
        <thead class="thead-dark">
        <tr>
        <th><center><font color='#218838'>Task Name </font></center></th>
        <th><center><font color='#218838'>Task Completion </font></center></th>
        <th><center><font color='#218838'>Task Details </font></center></th>
        <th><center><font color='#218838'>Task Done </font></center></th>
        </tr>
        </thead>

        {% for some in all_items %}

            {% if some.Task_Done %}

                <tr class="table-Success">
                <td><center> <strong>{{ some.Task_Name }} </strong></center></td>
                <td><center><a href='{% url 'Task-Pen' some.id %}'>Task Done</a></center></td>
                <td><a href='{% url 'Task-Data' some.id %}'><center>Details </center></td>
                <td><center><a href='{% url 'Del-Page' some.id %}'>Remove</a></center></td>
                </tr>

            {% else %}

                <tr class="table-default">
                <td><center> <strong>{{ some.Task_Name }} </strong></center></td>
                <td><center><a href='{% url 'Task-Done' some.id %}'>Task Pending </a></center></td>
                <td><a href='{% url 'Task-Data' some.id %}'><center>Details </center></td>
                <td><center><a href='{% url 'Del-Page' some.id %}'>Remove</a></center></td>
                </tr>
            {% endif %}

        {% endfor %}
    {% endif %}




</div>
{% endif %}

{% endblock %}

{%extends'ToDo_Files/base.html%}
{%block asd%}
任务
{%if消息%}


{消息%中的msg为%0}
☀
{{msg}}
{%endfor%}
{%endif%}


努力工作
{{user.username}
{%if所有_项%}


{%if request.user.is_superuser%}
任务名称
任务完成
任务详细信息
任务作者
任务完成
{所有_项中的某些项为%}
{%if some.Task_Done%}
{{some.Task_Name}}
{%else%}
{{some.Task_Name}}
{%endif%}
{%endfor%}
{%else%}
任务名称
任务完成
任务详细信息
任务完成
{所有_项中的某些项为%}
{%if some.Task_Done%}
{{some.Task_Name}}
{%else%}
{{some.Task_Name}}
{%endif%}
{%endfor%}
{%endif%}
{%endif%}
{%endblock%}

Base.html

<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">


  </head>
  <style>
    body {
  background-color:#fffff7;
}
  </style>


      <body >
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark">

      <a class="navbar-brand" href='{% url 'Display-Page' %}'>Django</a>

      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

        <!----><!----><!----><!---->
      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <a class="nav-link" href='{% url 'Home-Page' %}'>Home <span class="sr-only">(current)</span></a>
          </li>



          <li class="nav-item active">
            <a class="nav-link" href='{% url 'Logout-Page' %}'>Logout<span class="sr-only">(current)</span></a>
          </li>

        </ul>

        <form class="form-inline my-2 my-lg-0" method="POST">
            {% csrf_token %}
            <input type="hidden" name="owner_id" value="{{request.user.id}}">
          <input class="form-control mr-sm-2" type="search"placeholder="Add TO-DO" aria-label="Search" name="Task_Name">
          <button class="btn btn-success my-2 my-sm-0" type="submit" >Add TODO</button>
        </form>
      </div>

    </nav>
        <div class="container">

            {% block asd %}

            {% endblock %}
        </div>
        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
      </body>
    </html>

身体{
背景色：#FFFFF 7；
}






{%csrf_令牌%}
添加待办事项
{%block asd%}
{%endblock%}

子任务的html

{% extends 'ToDo_Files/base.html' %}
{% block asd %}
<title>Task Details</title>
    {% if item_all %}


    <form class="form-inline my-2 my-lg-0" method="POST" action="">
        {% csrf_token %}

            <br>  <br>


            <input class="form-control mr-sm-2" placeholder='Subtask' aria-label="Search" name="subTask">
            <br>

            <button class="btn btn-success my-2 my-sm-2" type="submit" >Add</button>



    </form>
    <br><br><br>




    {% endif %}

{% endblock %}

{%extends'ToDo_Files/base.html%}
{%block asd%}
任务详细信息
{%if item_all%}
{%csrf_令牌%}





添加




{%endif%}
{%endblock%}

网址

从django.conf.url导入url
从…起导入视图
从django.contrib.auth导入视图作为auth_视图
URL模式=[
url（r'^（？i）Home/'，views.HomeFun，name='Home-Page'），
url（r'^（？i）Display/'，views.Display_Page，name='Display-Page'），
url（r'^（？i）delete/（？P\d+/$），views.remove，name='Del-Page'），
url（r'^（？i）details/（？P\d+/$），views.data，name='Task-data'），
url（r'^（？i）registration/'，views.Reg_-Fun，name='Reg-Page'），
url（r'^（？i）login/'，auth_views.LoginView.as_view（template_name='ToDo_Files/login.html'），name='login-Page'），
url（r'^（？i）logout/'，auth_views.LogoutView.as_view（template_name='ToDo_Files/logout.html'），name='logout-Page'），
url（r'^（？i）Done/（？P\d+/$），views.Done_status，name='Task-Done'），
url（r'^（？i）Pending/（？P\d+/$），views.Pen_status，name='Task-Pen'），
]

我想在主页上看到一个进度条，显示在比较或从“子任务”复选框中获取输入后任务完成的百分比。 此外，我还可以在“子任务”页面中添加和删除新的子任务，在该页面中，我可以选中并取消选中任何子任务

先谢谢你

<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">


  </head>
  <style>
    body {
  background-color:#fffff7;
}
  </style>


      <body >
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark">

      <a class="navbar-brand" href='{% url 'Display-Page' %}'>Django</a>

      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

        <!----><!----><!----><!---->
      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <a class="nav-link" href='{% url 'Home-Page' %}'>Home <span class="sr-only">(current)</span></a>
          </li>



          <li class="nav-item active">
            <a class="nav-link" href='{% url 'Logout-Page' %}'>Logout<span class="sr-only">(current)</span></a>
          </li>

        </ul>

        <form class="form-inline my-2 my-lg-0" method="POST">
            {% csrf_token %}
            <input type="hidden" name="owner_id" value="{{request.user.id}}">
          <input class="form-control mr-sm-2" type="search"placeholder="Add TO-DO" aria-label="Search" name="Task_Name">
          <button class="btn btn-success my-2 my-sm-0" type="submit" >Add TODO</button>
        </form>
      </div>

    </nav>
        <div class="container">

            {% block asd %}

            {% endblock %}
        </div>
        <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
      </body>
    </html>

{% extends 'ToDo_Files/base.html' %}
{% block asd %}
<title>Task Details</title>
    {% if item_all %}


    <form class="form-inline my-2 my-lg-0" method="POST" action="">
        {% csrf_token %}

            <br>  <br>


            <input class="form-control mr-sm-2" placeholder='Subtask' aria-label="Search" name="subTask">
            <br>

            <button class="btn btn-success my-2 my-sm-2" type="submit" >Add</button>



    </form>
    <br><br><br>




    {% endif %}

{% endblock %}

from django.conf.urls import url
from . import views
from django.contrib.auth import views as auth_views



urlpatterns = [

    url(r'^(?i)Home/', views.HomeFun, name='Home-Page'),

    url(r'^(?i)Display/', views.Display_Page, name='Display-Page'),

    url(r'^(?i)delete/(?P<To_DO_Fun_id>\d+)/$', views.remove, name='Del-Page'),

    url(r'^(?i)details/(?P<To_DO_Fun_id>\d+)/$', views.data, name='Task-Data'),


    url(r'^(?i)registraion/', views.Reg_Fun, name='Reg-Page'),


    url(r'^(?i)login/', auth_views.LoginView.as_view(template_name='ToDo_Files/login.html'), name='Login-Page'),

    url(r'^(?i)logout/', auth_views.LogoutView.as_view(template_name='ToDo_Files/logout.html'), name='Logout-Page'),





    url(r'^(?i)Done/(?P<To_DO_Fun_id>\d+)/$', views.Done_status, name='Task-Done'),
    url(r'^(?i)Pending/(?P<To_DO_Fun_id>\d+)/$', views.Pen_status, name='Task-Pen'),
    ]