django 使用者管理（2）--建立使用者 and 删除使用者

準備js,jq

js寫在head裡，jq寫在body裡

bootstrap https://v3.bootcss.com/

databases http://www.datatables.club/

sweetalert http://mishengqiang.com/sweetalert

Django裡要設定下static 的目錄，和app 同等級目錄

STATICFILES_DIRS = [

os.path.join(BASE_DIR, 'static/')

]

<link rel="stylesheet" type="text/css" href="{% static 'bootstrap-3.3.7-dist/css/bootstrap.min.css' %}"/>

<link rel="stylesheet" type="text/css" href="{% static 'sweetalert-1.0.1/dist/sweetalert.css' %}"/>

<link rel="stylesheet" type="text/css" href="{% static 'DataTables-1.10.15/media/css/dataTables.bootstrap.min.css' %}"/>

<script type="text/javascript" src="{% static 'jquery/jquery-1.12.4.js' %}"></script>

<script type="text/javascript" src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.min.js' %}"></script>

<script type="text/javascript" src="{% static 'sweetalert-1.0.1/dist/sweetalert.min.js' %}"></script>

<script type="text/javascript" src="{% static 'DataTables-1.10.15/media/js/jquery.dataTables.min.js' %}"></script>

<script type="text/javascript" src="{% static 'DataTables-1.10.15/media/js/dataTables.bootstrap.min.js' %}"></script>

1、表格table,需要用到bootstrap(css) databases(jq)

2、jq，js中的id 屬性 用#，class 用.

比如定義 id=table_use 那用jq，就是jQuery('#table_use'),class 用jQuery('.table_use')

3、寫js,jq 必須在script 裡寫，jq就寫在jQuery(document).ready(function () {});裡

<script type="text/javascript">

jQuery(document).ready(function () {

Query('#table_user').方法 ==》找到id=table_user後 ，然後再用什麼方法

</script>

通過ajax的方式把資料傳到後端，然後後端傳回資料到前台

ajax: Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）

調用方式：

url:後端請求的位址

data:發送到後端的資料到請求的位址上

function(result) {console.log(result)} ：請求成功後，後端return 傳回的資料；console.log(result);傳回的是一個字典格式

json : 傳回的資料格式

post

jQuery.post(url,data,function(result) {console.log(result)},'json')

get

jQuery.get(url,data,function(result) {console.log(result)},'json')

href="javascript:void(0)" 禁用a标簽跳轉

定義一個errors 的清單，循環伺服器傳回的errors格式為：errors:{name: "使用者名已存在", password: "密碼不一緻", tel: "号碼格式不對", age: "年齡格式不對"},變量k,v；通過push将v加入到自定義的errors中;push相當于list.append(v)

var errors = [];

jQuery.each(result['errors'], function (k, v) {

errors.push(v);

});

sweetalert:

closeOnCancel: true 點選退出框 退出，為false則不退

伺服器端傳回json的格式資料：

from django.http import HttpResponse,JsonResponse

return JsonResponse({'code':400,'errors':errors}) ===》傳回的資料相當于result

code：200 成功傳回

code：400 伺服器傳回錯誤 （比如驗證失敗）

code：403 未登入