student.py
from django.shortcuts import render,HttpResponse,redirect
from app01 import models
import json
def student_show(request):
stu_list=models.Students.objects.all()
cls_list=models.Classes.objects.all()
return render(request,'student.html',locals())
def add_student(request):
result={'status':True,'message':None,'data':None}
n = request.POST.get('name')
a = request.POST.get('age')
g = request.POST.get('gender')
c = request.POST.get('cls')
try:
obj=models.Students.objects.create(name=n,age=a,gender=g,cs_id=c)
request.data=obj.id
except Exception as e:
result = {'status': False, 'message': '用户输入错误','data':None}
result=json.dumps(result,ensure_ascii=False)
return HttpResponse(result)
student.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="/static/plungins/bootstrap/css/bootstrap.css"/>
<link rel="stylesheet" href="/static/plungins/font-awesome/font-awesome-4.7.0/css/font-awesome.css"/>
<style>
.my-icon {
margin: 0 8px;
font-size: 20px;
}
</style>
</head>
<body>
<div class="container">
<div style="padding: 20px 0">
<a class="btn btn-primary " id="addbtn">添加</a>
<a class="btn btn-danger">删除</a>
</div>
<div>
<table class="table table-bordered">
<thead>
<tr>
<th>id</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
<th>操作</th>
</tr>
</thead>
<tboday id="add_tr">
{% for item in stu_list %}
<tr>
<td>{{ item.id }}</td>
<td>{{ item.name }}</td>
<td>{{ item.age }}</td>
<td>{{ item.gender }}</td>
<td class="my-a"><a href="" class="fa fa-close my-icon"></a><a href=""
class="fa fa-pencil my-icon"></a>
</td>
</tr>
{% endfor %}
</tboday>
</table>
</div>
</div>
<div>
<!-- Modal -->
<div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">添加学生</h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label">姓名</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="name" placeholder="姓名">
</div>
</div>
<div class="form-group">
<label for="age" class="col-sm-2 control-label">年龄</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="age" placeholder="年龄">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">性别</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="gender" value="1"> 男
</label>
<label class="radio-inline">
<input type="radio" name="gender" value="0"> 女
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">班级</label>
<div class="col-sm-10">
<select class="form-control" name="cls">
{% for item in cls_list %}
<option value="{{ item.id }}">{{ item.name }}</option>
{% endfor %}
</select>
</label>
</div>
</div>
</form>
</div>
<span id="error_msg" style="color: red"></span>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary" id="save_btn">保存</button>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="/static/js/jquery-3.3.1.js"></script>
<script src="/static/plungins/bootstrap/js/bootstrap.js"></script>
<script>
$(function () {
bindEvent();
});
function bindEvent() {
$('#addbtn').click(function () {
$('#addModal').modal('show')
});
$('#save_btn').click(function () {
var post_data={};
$('#addModal').find('input,select').each(function () {
var n=$(this).attr('name');
var v=$(this).val();
if($(this).attr('checked')){
post_data[n]=v;
}
else{
post_data[n]=v;
}
});
$.ajax(
{
url:'/add_student/',
type:'POST',
data:post_data,
success:function(arg){
var dic=JSON.parse(arg)
if (dic.status){
window.location.reload();
$('#addModal').modal('hide');
}
else{
$('#error_msg').text(dic.message)
}
}
}
)
});
}
</script>
</html>