今天无意间看到 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{ 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
