simple-todo: 一个简易的 todo 程序 - django版
今天无意间看到 simple-todo: 一个简易的 todo 程序 - web.py 中文教程 ,然后发现竟然有好多的版本 http://simple-is-better.com/news/tag/simple-todo
然后看到django版的是个半成品,好吧,自己动手丰衣足食。
django 安装配置这里就不再介绍了,直接给之前的地址: django 简易博客开发 1 安装、创建、配置、admin使用
使用的环境: fedora 17 + django1.4 + python2.7 + sqlite3
前端使用的 bootstrap + jquery
实现添加修改删除 ajax支持 可自行添加用户控制
1、django安装 project 创建 、app 创建、安装、admin使用
看着个吧,这篇博客有详细教程
2、上代码
#!/usr/bin/python
# -*- coding: utf-8 -*- from django.db import models
from django_openid_auth.models import User
#之前我用过openid 这里换成 from django.contrib.auth.models import User 就可以了 class Todo(models.Model):
user = models.ForeignKey(User)
todo = models.CharField(max_length=50)
flag = models.CharField(max_length=2, default='1')
priority = models.CharField(max_length=2, default='0')
pubtime = models.DateTimeField(auto_now_add=True) def __unicode__(self):
return u'%d %s %s' % (self.id, self.todo, self.flag) class Meta:
ordering = ['priority', 'pubtime']
priority 为优先级 排序时优先级高的在前面,越小优先级越高;然后再按时间排序,越早越靠前
flag 标记是否完成 默认为1表示未完成
当然这两处改为models.IntegerField 更好一些,可以自己修改一下
创建数据库:
python manage.py syncdb
在admin查看
#!/usr/bin/python
# -*- coding: utf-8 -*- from django.contrib import admin
from simpleToDo.models import Todo class TodoAdmin(admin.ModelAdmin):
list_display = ('user', 'todo', 'priority', 'flag', 'pubtime')
list_filter = ('pubtime',)
ordering = ('-pubtime',) admin.site.register(Todo, TodoAdmin)
urls.py
#!/usr/bin/python
# -*- coding: utf-8 -*- from django.conf.urls import * urlpatterns = patterns(('simpleToDo.views'),
url(r'^$', 'todolist', name='todo'),
url(r'^addtodo/$', 'addTodo', name='add'),
url(r'^todofinish/(?P<id>\d+)/$', 'todofinish', name='finish'),
url(r'^todobackout/(?P<id>\d+)/$', 'todoback', name='backout'),
url(r'^updatetodo/(?P<id>\d+)/$', 'updatetodo', name='update'),
url(r'^tododelete/(?P<id>\d+)/$', 'tododelete', name='delete'),
)
views.py
1 from django.shortcuts import render_to_response
2 from django.http import HttpResponseRedirect
3 from django.template import RequestContext
4 from django_openid_auth.models import User
5 from django.http import Http404
6 from simpleToDo.models import Todo
7
8
9 def todolist(request):
10 todolist = Todo.objects.filter(flag=1)
11 finishtodos = Todo.objects.filter(flag=0)
12 return render_to_response('simpleTodo.html',
13 {'todolist': todolist, 'finishtodos': finishtodos},
14 context_instance=RequestContext(request))
15
16
17 def todofinish(request, id=''):
18 todo = Todo.objects.get(id=id)
19 if todo.flag == '1':
20 todo.flag = '0'
21 todo.save()
22 return HttpResponseRedirect('/simpleTodo/')
23 todolist = Todo.objects.filter(flag=1)
24 return render_to_response('simpleTodo.html', {'todolist': todolist},
25 context_instance=RequestContext(request))
26
27
28 def todoback(request, id=''):
29 todo = Todo.objects.get(id=id)
30 if todo.flag == '0':
31 todo.flag = '1'
32 todo.save()
33 return HttpResponseRedirect('/simpleTodo/')
34 todolist = Todo.objects.filter(flag=1)
35 return render_to_response('simpleTodo.html', {'todolist': todolist},
36 context_instance=RequestContext(request))
37
38
39 def tododelete(request, id=''):
40 try:
41 todo = Todo.objects.get(id=id)
42 except Exception:
43 raise Http404
44 if todo:
45 todo.delete()
46 return HttpResponseRedirect('/simpleTodo/')
47 todolist = Todo.objects.filter(flag=1)
48 return render_to_response('simpleTodo.html', {'todolist': todolist},
49 context_instance=RequestContext(request))
50
51
52 def addTodo(request):
53 if request.method == 'POST':
54 atodo = request.POST['todo']
55 priority = request.POST['priority']
56 user = User.objects.get(id='1')
57 todo = Todo(user=user, todo=atodo, priority=priority, flag='1')
58 todo.save()
59 todolist = Todo.objects.filter(flag='1')
60 finishtodos = Todo.objects.filter(flag=0)
61 return render_to_response('showtodo.html',
62 {'todolist': todolist, 'finishtodos': finishtodos},
63 context_instance=RequestContext(request))
64 else:
65 todolist = Todo.objects.filter(flag=1)
66 finishtodos = Todo.objects.filter(flag=0)
67 return render_to_response('simpleTodo.html',
68 {'todolist': todolist, 'finishtodos': finishtodos})
69
70
71 def updatetodo(request, id=''):
72 if request.method == 'POST':
73 print 'ddd'
74 atodo = request.POST['todo']
75 priority = request.POST['priority']
76 user = User.objects.get(id='1')
77 todo = Todo(user=user, todo=atodo, priority=priority, flag='1')
78 todo.save()
79 todolist = Todo.objects.filter(flag='1')
80 finishtodos = Todo.objects.filter(flag=0)
81 return render_to_response('simpleTodo.html',
82 {'todolist': todolist, 'finishtodos': finishtodos},
83 context_instance=RequestContext(request))
84 else:
85 try:
86 todo = Todo.objects.get(id=id)
87 except Exception:
88 raise Http404
89 return render_to_response('updatatodo.html', {'todo': todo},
90 context_instance=RequestContext(request))
因为表单使用的是post方法,所以每个view 后都添加了 context_instance=RequestContext(request)
否则可能会出现这个错误
/usr/lib/python2.7/site-packages/django/template/defaulttags.py:55: UserWarning: A {% csrf_token %} was used in a template, but the context did not provide the value. This is usually caused by not using RequestContext.
warnings.warn("A {% csrf_token %} was used in a template, but the context did not provide the value. This is usually caused by not using RequestContext.")
templates 代码
<!DOCTYPE html>
<html lang="en">
<head>
<title>{% block title %}Simple Todo{% endblock %}</title>
<meta charset="UTF-8" />
<link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/code.css">
<script src="/static/js/modernizr.js"></script>
<script src="/static/js/jquery.js"></script>
{% block extra_head %}
<style>
body {padding-top: 40px;}
.ftodo{text-decoration : line-through ; }
textarea{ width: 97%;
padding: 5px;
font-size: 14px;
resize: vertical;}
</style>
<script type="text/javascript">
function sendtwitter(){
$('#myModal form').submit(function(){
$.ajax({
type: "POST",
data: $('#myModal form').serialize(),
url: "{% url add %}",
cache: false,
dataType: "html",
success: function(html, textStatus) {
$('#todo').replaceWith(html);
$('#myModal').modal('hide');
$('#myModal form')[0].reset();
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$('#comment_form form').replaceWith('Your comment was unable to be posted at this time. We apologise for the inconvenience.');
}
});
return false;
});
}
$(document).ready(function(){
sendtwitter();
})
</script>
{% endblock %}
</head>
<body>
<div class="container">
<div class="row">
<div class="span8 offset2">
<div id="todo" class="well">
{% block todo %}
<table class="table table-hover">
<thead>
<tr>
<td>
<h3 class="text-success">待办事项</h3>
</td>
</tr>
</thead>
<tbody>
{% for todo in todolist %}
{% if todo.priority == '1' %}
<tr class='error'>
{% endif %}
{% if todo.priority == '2' %}
<tr class='warning'>
{% endif %}
{% if todo.priority == '3' %}
<tr class='info'>
{% endif %}
<td class="todo">{{ todo.todo }}</td>
<td class="te">
<div class="span2">
<a href="{% url finish todo.id %}" title="finish"><i class=" icon-ok"></i></a>
<a href="{% url update todo.id %}" title="edit"><i class="icon-edit"></i></a>
<a href="{% url delete todo.id %}" title="delete"><i class="icon-trash"></i></a>
</div>
</td>
</tr>
{% endfor %}
{% for ftodo in finishtodos %}
<tr class='success'>
<td class="ftodo muted">{{ ftodo.todo }}</td>
<td class="te">
<div class="span2">
<a href="{% url backout ftodo.id %}" title="finish"><i class=" icon-repeat"></i></a>
<a href="{% url update ftodo.id %}" title="edit"><i class="icon-edit"></i></a>
<a href="{% url delete ftodo.id %}" title="delete"><i class="icon-trash"></i></a>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<a class="btn btn-success" href="#myModal" role="button" data-toggle="modal">
<i class="icon-plus icon-white"></i><span > ADD</span>
</a>
{% endblock %}
</div>
</div>
</div>
</div>
<div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Add TODO</h3>
</div>
<form action="" method="post">{% csrf_token %}
<div class="modal-body">
<textarea name="todo" class="txtodo" id="txtodo" required="required">{{ todo.todo }}</textarea>
<fieldset>
<label class="radio inline" for="priority">
<span class="label label-info">Priority</span>
</label>
<label class="radio inline" for="priority">
<input type="radio" name="priority" value="1"/>
<span class="label label-important">重要</span>
</label>
<label class="radio inline" for="priority">
<input type="radio" name="priority" value="2"/>
<span class="label label-warning">警告</span>
</label>
<label class="radio inline" for="priority">
<input type="radio" name="priority" value="3"/>
<span class="label label-success">成功</span>
</label>
</fieldset>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button id="send" class="btn btn-success" type="submit" name="submit" >Save changes</button>
</div>
</form>
</div>
<script src="/static/js/bootstrap.min.js"></script>
</body>
</html>
1 <div id="todo">
2 <table class="table table-hover">
3 <thead>
4 <tr>
5 <td>
6 <h4>todo</h4>
7 </td>
8 <td>
9 <a class="btn btn-success" href="#myModal" role="button" data-toggle="modal">
10 <i class="icon-plus icon-white"></i><span > ADD</span>
11 </a>
12 </td>
13 </tr>
14 </thead>
15 <tbody>
16 {% for todo in todolist %}
17 {% if todo.priority == '1' %}
18 <tr class='error'>
19 {% endif %}
20 {% if todo.priority == '2' %}
21 <tr class='warning'>
22 {% endif %}
23 {% if todo.priority == '3' %}
24 <tr class='info'>
25 {% endif %}
26 <td class="todo">{{ todo.todo }}</td>
27 <td class="te">
28 <div class="span2">
29 <a href="{% url finish todo.id %}" title="finish"><i class=" icon-ok"></i></a>
30 <a href="{% url updateblog todo.id %}" title="edit"><i class="icon-edit"></i></a>
31 <a href="{% url delete todo.id %}" title="delete"><i class="icon-trash"></i></a>
32 </div>
33 </td>
34 </tr>
35 {% endfor %}
36 {% for ftodo in finishtodos %}
37 <tr class='success'>
38 <td class="todo muted">{{ ftodo.todo }}</td>
39 <td class="te">
40 <div class="span2">
41 <a href="{% url backout ftodo.id %}" title="finish"><i class=" icon-ok"></i></a>
42 <a href="{# {% url updateblog blog.id %} #}" title="edit"><i class="icon-edit"></i></a>
43 <a href="{% url delete ftodo.id %}" title="delete"><i class="icon-trash"></i></a>
44 </div>
45 </td>
46 </tr>
47 {% endfor %}
48 </tbody>
49 </table>
50 </div>
1 {% extends 'simpleTodo.html'%}
2
3 {% block title %} update Todo {% endblock %}
4
5 {% block todo %}
6 <form action="{% url update todo.id %}" method="post">{% csrf_token %}
7 <div class="modal-body">
8 <textarea name="todo" class="txtodo" id="txtodo" required="required">{{ todo.todo }}</textarea>
9 <fieldset>
10 <label class="radio inline" for="priority">
11 <span class="label label-info">Priority</span>
12 </label>
13 <label class="radio inline" for="priority">
14 <input type="radio" name="priority" value="1" {% if todo.priority == '1' %} checked{% endif %}/>
15 <span class="label label-important">重要</span>
16 </label>
17 <label class="radio inline" for="priority">
18 <input type="radio" name="priority" value="2" {% if todo.priority == '2' %} checked{% endif %}/>
19 <span class="label label-warning">警告</span>
20 </label>
21 <label class="radio inline" for="priority">
22 <input type="radio" name="priority" value="3" {% if todo.priority == '3' %} checked{% endif %}/>
23 <span class="label label-success">成功</span>
24 </label>
25 </fieldset>
26 </div>
27 <div class="modal-footer">
28 <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
29 <button id="send" class="btn btn-success" type="submit" name="submit" >Save changes</button>
30 </div>
31 </form>
32 {% endblock %}
实现效果
1、首页
2、添加事项页面
3、修改事项时页面
项目地址: https://github.com/goodspeedcheng/Django-Simple-Todo
希望大家能把错误的地方指出来,让django版todo的更好一些 谢谢
http://www.cnblogs.com/cacique/archive/2012/10/06/2713415.html
simple-todo: 一个简易的 todo 程序 - django版的更多相关文章
- 如何用 Python 写一个简易的抽奖程序
不知道有多少人是被这个头图骗进来的:) 事情的起因是这样的,上周有同学问小编,看着小编的示例代码敲代码,感觉自己也会写了,如果不看的话,七七八八可能也写的出来,但是一旦自己独立写一段程序,感觉到无从下 ...
- 一个简易的WebServer程序
现在这个公司的it管理真不知道说什么了,我主要从事.net方向的开发,公司电脑配置还是win7了,可是自己没有安装iis的权限,it也拒绝安装,想玩玩web安全都不行.于是乎决定开发一个window ...
- 任务02——安装 Intellj IDEA,编写一个简易四则运算小程序,并将代码提交到 GitHub
github地址:https://github.com/ErhuoHome/First.git 安装jdk与intellij idea没有太大问题,以前安装过eclipse 在程序方面,由于对真分数的 ...
- Tinychatserver: 一个简易的命令行群聊程序
这是学习网络编程后写的一个练手的小程序,可以帮助复习socket,I/O复用,非阻塞I/O等知识点. 通过回顾写的过程中遇到的问题的形式记录程序的关键点,最后给出完整程序代码. 0. 功能 编写一个简 ...
- Cocoa练习01:一个简单的Todo list程序
写一个简单的todo list程序,界面如下图: 在TextField区域输入文字,点击Add按钮会将文字显示在下面的TableView列表中.TableView列表有2列,第一列是文字的输入时间:第 ...
- Python Django 编写一个简易的后台管理工具4-添加admin模版
导入admin后台模版 可以在网上任意搜索模版,我这里也提供一个地址github 拷贝admin后台的html文件至项目的templates文件夹 创建static文件夹,将admin后台的js,im ...
- Vue.js 入门:从零开始做一个极简 To-Do 应用
Vue.js 入门:从零开始做一个极简 To-Do 应用 写作时间:2019-12-10版本信息:Vue.js 2.6.10官网文档:https://cn.vuejs.org/ 前言 学习 Vue ...
- 使用Ant Design写一个仿微软ToDo
实习期的第一份活,自己看Ant Design的官网学习,然后用Ant Design写一个仿微软ToDo. 不做教学目的,只是记录一下. 1.学习 Ant Design 是个组件库,想要会用,至少要知道 ...
- ASP.NET Core Blazor WebAssembly实现一个简单的TODO List
基于blazor实现的一个简单的TODO List 最近看到一些大佬都开始关注blazor,我也想学习一下.做了一个小的demo,todolist,仅是一个小示例,参考此vue项目的实现http:// ...
随机推荐
- CentOS 7上修改主机名
如何在CentOS 7上修改主机名 在Cent ...
- Ubuntu 16.04 LTS下matplotlib安装出错
使用命令sudo pip3 install matplotlib已知报错,用同样的命令安装numpy和opencv却没有,因此重装linux系统两次都没有解决(我是在Vmware中创建的).报错如下: ...
- axios token header response request http拦截器 axios实现登录、拦截、登出
axios token header response request http拦截器 axios实现登录.拦截.登出 一个项目学会前端实现登录拦截 https://github.com/superm ...
- c:if标签--判断不为空和其他的值判断
用<c:if test=""></c:if>标签时 <c:if test="${sl.chc_status==1 }"> ...
- HTML页面中5种超酷的伪类选择器:hover效果
想在自己的网站中应用超酷的hover效果吗?也许你可以从如下的这些实例中获得一些灵感,如果你喜欢这些效果,也可以直接拷贝代码并应用到你的站点. 给平淡的站点带来活力 hover效果能给网页增加一些动态 ...
- ajax从入门到深入精通
前言 ajax全称Asynchronous Javascript and XML.其中Asynchronous代表异步.同步于异步是描述通信模式的概念,同步机制:发送方发生请求后,需要等待接收到接收方 ...
- VW结合rem进行移动端布局
---恢复内容开始--- html { font-size:10vw: } div { width: 1rem; height: 1rem; } VW这个单位适合用来适应不同设备的 一个设备的宽度就为 ...
- mysql 数据库 show命令
MySQL中有很多的基本命令,show命令也是其中之一,在很多使用者中对show命令的使用还容易产生混淆,本文汇集了show命令的众多用法. 1. show tables或show tables fr ...
- Ubuntu 和 centos7 服务的启动
Ubuntu 下: /etc/init.d/nginx start | stop | reload Centos7下: service nginx start | stop | reload
- Linux的硬件时间、校正Linux系统时间及系统时间调用流程
第一部分: 一)概述: 事实上在Linux中有两个时钟系统,分别是系统时间和硬件时间 UTC是协调世界时(Universal Time Coordinated)英文缩写,它比北京时间早8个小时. ...