質問編集履歴
3
viewの追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -101,6 +101,13 @@
|
|
|
101
101
|
</div>
|
|
102
102
|
|
|
103
103
|
```
|
|
104
|
+
```view
|
|
105
|
+
# 削除へのリクエストに対する処理
|
|
106
|
+
def delete(request, id):
|
|
107
|
+
employee = get_object_or_404(User, pk=id)
|
|
108
|
+
employee.delete()
|
|
109
|
+
return redirect('employee:show')
|
|
110
|
+
```
|
|
104
111
|
|
|
105
112
|
### 試したこと
|
|
106
113
|
|
2
onsubmit属性の活用
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -104,50 +104,47 @@
|
|
|
104
104
|
|
|
105
105
|
### 試したこと
|
|
106
106
|
|
|
107
|
-
```
|
|
107
|
+
```
|
|
108
|
-
|
|
108
|
+
<!-- 更新と削除のボタン表示 -->
|
|
109
109
|
<td class="edit">
|
|
110
110
|
<button><a href="{% url 'employee:update' id=value.id %}"><img src="{% static "employee/update-btn.png" %}"></a></button>
|
|
111
|
-
<
|
|
111
|
+
<form name="delete_form" id="delete_form" onsubmit="return confirm();" method="post" action="{% url 'employee:delete' id=value.id %}"></form>
|
|
112
|
-
<form method="post" action="{% url 'employee:delete' id=value.id %}">
|
|
113
|
-
|
|
112
|
+
{% csrf_token %}
|
|
114
|
-
<dialog id='dialog'>
|
|
115
|
-
<h3>登録者情報の削除確認</h3>
|
|
116
|
-
<div>
|
|
117
|
-
この行を削除しますか？
|
|
118
|
-
</div>
|
|
119
|
-
<footer>
|
|
120
|
-
<button id='cancel_button'>いいえ</button>
|
|
121
|
-
|
|
113
|
+
<button id='del_btn' class='del_btn' type="submit"><img src="{% static "employee/delete-btn.png" %}"></button>
|
|
122
|
-
</footer>
|
|
123
|
-
</dialog>
|
|
124
|
-
</form>
|
|
114
|
+
</form>
|
|
125
115
|
</td>
|
|
126
116
|
</td>
|
|
127
117
|
</tr>
|
|
128
118
|
{% endfor %}
|
|
129
119
|
</table>
|
|
130
|
-
|
|
131
|
-
<script>
|
|
132
|
-
document.getElementById("dialog").style.display = "none";
|
|
133
|
-
function clickDelete(id){
|
|
134
|
-
const dialog = document.getElementById("dialog");
|
|
135
120
|
|
|
136
|
-
if(dialog.style.display=="block"){
|
|
137
|
-
|
|
121
|
+
<div id="dl2" style="display:none;">
|
|
122
|
+
<p>この行を削除しますか？</p>
|
|
138
|
-
|
|
123
|
+
</div>
|
|
139
|
-
|
|
124
|
+
<script type="text/javascript">
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
document.getElementById("cancel_button").addEventListener('click',() =>{
|
|
143
|
-
return false;
|
|
144
|
-
|
|
125
|
+
/* function confirm() {} */
|
|
145
|
-
})
|
|
146
|
-
}
|
|
147
126
|
|
|
127
|
+
$(function confirm() {
|
|
128
|
+
$(".del_btn").click(function() {
|
|
129
|
+
$("#dl2").dialog({
|
|
130
|
+
modal:true,
|
|
131
|
+
title:"登録者情報の削除確認",
|
|
132
|
+
buttons: {
|
|
133
|
+
"はい": function() {
|
|
134
|
+
$(this).dialog("close");
|
|
135
|
+
},
|
|
136
|
+
"いいえ": function() {
|
|
137
|
+
return false;
|
|
138
|
+
$(this).dialog("close");
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
});
|
|
142
|
+
});
|
|
143
|
+
});
|
|
148
144
|
</script>
|
|
149
145
|
```
|
|
146
|
+
formタグにonsubmit属性を追加
|
|
150
|
-
|
|
147
|
+
ダイアログで『いいえ』を選択するとsubmitをキャンセルさせる
|
|
151
148
|
### 補足情報（FW/ツールのバージョンなど）
|
|
152
149
|
Windows10
|
|
153
150
|
Python3.9.4
|
1
jQueryを活用したことによるコード変更
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -23,6 +23,15 @@
|
|
|
23
23
|
### 該当のソースコード
|
|
24
24
|
|
|
25
25
|
```HTML
|
|
26
|
+
<!-- CSSの設定 -->
|
|
27
|
+
{% load static %}
|
|
28
|
+
<link rel="stylesheet" type="text/css" href="{% static 'employee/reset.css' %}">
|
|
29
|
+
<link rel="stylesheet" type="text/css" href="{% static 'employee/style.css' %}">
|
|
30
|
+
<link rel="stylesheet" type="text/css" href="{% static 'employee/show.css' %}">
|
|
31
|
+
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
|
|
32
|
+
<script type="text/javascript" src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
|
|
33
|
+
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/pepper-grinder/jquery-ui.css">
|
|
34
|
+
|
|
26
35
|
<div class = top>
|
|
27
36
|
<h1>一覧</h1>
|
|
28
37
|
<!-- ページを遷移するボタンの表示 -->
|
|
@@ -55,54 +64,42 @@
|
|
|
55
64
|
{% if value.department == 3 %}営業{% endif %}</td>
|
|
56
65
|
<!-- 更新と削除のボタン表示 -->
|
|
57
66
|
<td class="edit">
|
|
58
|
-
|
|
59
|
-
|
|
67
|
+
<button><a href="{% url 'employee:update' id=value.id %}"><img src="{% static "employee/update-btn.png" %}"></a></button>
|
|
60
|
-
|
|
68
|
+
<button id='del_btn' class='del_btn'><img src="{% static "employee/delete-btn.png" %}"></button>
|
|
61
|
-
|
|
62
|
-
|
|
69
|
+
<div id="dl2" style="display:none;">
|
|
63
|
-
|
|
70
|
+
<p>この行を削除しますか？</p>
|
|
64
|
-
|
|
71
|
+
<footer>
|
|
72
|
+
<button id='cancel_button'>いいえ</button>
|
|
73
|
+
<form name="delete_form" id="delete_form" method="post" action="{% url 'employee:delete' id=value.id %}"></form>
|
|
65
|
-
|
|
74
|
+
{% csrf_token %}
|
|
75
|
+
<button id='delete_button' type="submit">はい</button>
|
|
76
|
+
</form>
|
|
77
|
+
</footer>
|
|
66
|
-
|
|
78
|
+
</div>
|
|
67
|
-
<footer>
|
|
68
|
-
<button id='cancel_button'>いいえ</button>
|
|
69
|
-
<form name="delete_form" id="delete_form" method="post" action="{% url 'employee:delete' id=value.id %}"></form>
|
|
70
|
-
{% csrf_token %}
|
|
71
|
-
<button id='delete_button' type="submit">はい</button><!-- onclick='return confirm("この行を削除しますか?");' -->
|
|
72
|
-
</form>
|
|
73
|
-
</footer>
|
|
74
|
-
</dialog>
|
|
75
|
-
|
|
76
79
|
</td>
|
|
77
80
|
</td>
|
|
78
81
|
</tr>
|
|
79
82
|
{% endfor %}
|
|
80
83
|
</table>
|
|
81
84
|
|
|
82
|
-
<script>
|
|
83
|
-
|
|
85
|
+
<script type="text/javascript">
|
|
84
|
-
|
|
86
|
+
|
|
85
|
-
function
|
|
87
|
+
$(function() {
|
|
88
|
+
$(".del_btn").click(function() {
|
|
89
|
+
$("#dl2").dialog({
|
|
90
|
+
modal:true,
|
|
91
|
+
title:"登録者情報の削除確認",
|
|
92
|
+
buttons: {
|
|
86
|
-
|
|
93
|
+
"はい": function() {$(this).dialog("close");},
|
|
87
|
-
|
|
88
|
-
|
|
94
|
+
"いいえ": function() {$(this).dialog("close");}
|
|
89
|
-
dialog.style.display = "none";
|
|
90
|
-
}else{
|
|
91
|
-
dialog.style.display = "block";
|
|
92
|
-
|
|
95
|
+
}
|
|
93
|
-
|
|
94
|
-
document.getElementById("cancel_button").addEventListener('click', () => {
|
|
95
|
-
dialog.style.display = "none";
|
|
96
|
-
return false;
|
|
97
96
|
});
|
|
98
|
-
document.getElementById("delete_button").addEventListener('click', function() {
|
|
99
|
-
document.getElementById("delete_form").submit(); <!-- ここのコードをどう記述すればいいか分かりません -->
|
|
100
|
-
|
|
97
|
+
});
|
|
101
|
-
};
|
|
98
|
+
});
|
|
102
|
-
|
|
103
|
-
|
|
99
|
+
</script>
|
|
104
100
|
</div>
|
|
105
101
|
</div>
|
|
102
|
+
|
|
106
103
|
```
|
|
107
104
|
|
|
108
105
|
### 試したこと
|