[英]My submit button in html template is not working in django
我准備了HTML的出勤登記模板。我在給定的HTML頁面中有一個HTML表和一個Submit按鈕。當單擊Submit按鈕時,我想將數據保存在HTML表中。但是我不能。
Ist std.html
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<title>Attendance register</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
table#t01 {
width: 100%;
background-color: #f1f1c1;
}
</style>
</head>
<body>
<h1><center><u>ATTENDANCE-REGISTER</u></center></h1><br>
<h2><center><i>Ist Standard</i></center></h2>
<h4>Class in-charge: Hema.B <br><br>
Date: June 2016 - March 2017</h4>
<form name="demo_form.asp" method="get">
<button type="submit" value="continue">Submit</button>
</form>
{% if user.is_authenticated %}
<a href="{% url 'post_new' %}" class="top-menu"><span class="glyphicon glyphicon-plus"></span></a>
{% endif %}
<table style="width:100%">
<tr>
<th>Slno</th>
<th>Name</th>
<th>Attendance</th>
</tr>
<tr>
<td>1</td>
<td>Abijith</td>
<td><input type="number" id="aNumber">
<button onclick="aFunction()"><font color="green">Present</button>
<button onclick="abFunction()"><font color="red">Absent</button>
<input type="number" id="abNumber">
</td>
</tr>
<tr>
<td>2</td>
<td>Adithya</td>
<td><input type="number" id="bNumber">
<button onclick="bFunction()"><font color="green">Present</button>
<button onclick="acFunction()"><font color="red">Absent</button>
<input type="number" id="acNumber"></td>
</tr>
<tr>
<td>3</td>
<td>Bavana</td>
<td><input type="number" id="cNumber">
<button onclick="cFunction()"><font color="green">Present</button>
<button onclick="adFunction()"><font color="red">Absent</button>
<input type="number" id="adNumber"></td>
</tr>
<tr>
<td>4</td>
<td>Bibin</td>
<td><input type="number" id="dNumber">
<button onclick="dFunction()"><font color="green">Present</button>
<button onclick="aeFunction()"><font color="red">Absent</button>
<input type="number" id="aeNumber"></td>
</tr>
<tr>
<td>5</td>
<td>Devan</td>
<td><input type="number" id="eNumber">
<button onclick="eFunction()"><font color="green">Present</button>
<button onclick="afFunction()"><font color="red">Absent</button>
<input type="number" id="afNumber"></td>
</tr>
<tr>
<td>6</td>
<td>Faizal</td>
<td><input type="number" id="fNumber">
<button onclick="fFunction()"><font color="green">Present</button>
<button onclick="agFunction()"><font color="red">Absent</button>
<input type="number" id="agNumber"></td>
</tr>
<tr>
<td>7</td>
<td>Ganga</td>
<td><input type="number" id="gNumber">
<button onclick="gFunction()"><font color="green">Present</button>
<button onclick="ahFunction()"><font color="red">Absent</button>
<input type="number" id="ahNumber"></td>
</tr>
<tr>
<td>8</td>
<td>Haris</td>
<td><input type="number" id="hNumber">
<button onclick="hFunction()"><font color="green">Present</button>
<button onclick="aiFunction()"><font color="red">Absent</button>
<input type="number" id="aiNumber"></td>
</tr>
<tr>
<td>9</td>
<td>Jamsina</td>
<td><input type="number" id="iNumber">
<button onclick="iFunction()"><font color="green">Present</button>
<button onclick="ajFunction()"><font color="red">Absent</button>
<input type="number" id="ajNumber"></td>
</tr>
<tr>
<td>10</td>
<td>Tara</td>
<td><input type="number" id="jNumber">
<button onclick="jFunction()"><font color="green">Present</button>
<button onclick="akFunction()"><font color="red">Absent</button>
<input type="number" id="akNumber"></td>
</tr>
</table>
<br>
<body>
<script>
function aFunction() {
document.getElementById("aNumber").stepUp();
}
function abFunction() {
document.getElementById("abNumber").stepUp();
}
function bFunction() {
document.getElementById("bNumber").stepUp();
}
function acFunction() {
document.getElementById("acNumber").stepUp();
}
function cFunction() {
document.getElementById("cNumber").stepUp();
}
function adFunction() {
document.getElementById("adNumber").stepUp();
}
function dFunction() {
document.getElementById("dNumber").stepUp();
}
function aeFunction() {
document.getElementById("aeNumber").stepUp();
}
function eFunction() {
document.getElementById("eNumber").stepUp();
}
function afFunction() {
document.getElementById("afNumber").stepUp();
}
function fFunction() {
document.getElementById("fNumber").stepUp();
}
function agFunction() {
document.getElementById("agNumber").stepUp();
}
function gFunction() {
document.getElementById("gNumber").stepUp();
}
function ahFunction() {
document.getElementById("ahNumber").stepUp();
}
function hFunction() {
document.getElementById("hNumber").stepUp();
}
function aiFunction() {
document.getElementById("aiNumber").stepUp();
}
function iFunction() {
document.getElementById("iNumber").stepUp();
}
function ajFunction() {
document.getElementById("ajNumber").stepUp();
}
function jFunction() {
document.getElementById("jNumber").stepUp();
}
function akFunction() {
document.getElementById("akNumber").stepUp();
}
</script>
</body>
</html>
Views.py
def Ist_std(request):
if 'save' in request.POST:
form = PostForm(request.POST)
if form.is_valid():
post = form.save(commit=False)
post.save()
return redirect('blog/IInd_std.html', pk=post.pk)
else:
form = PostForm()
return render(request, 'blog/Ist_std.html')
urls.py
from django.conf.urls import url
from . import views
urlpatterns = [
url(r'^Ist_std/$', views.Ist_std, name='Ist_std'),
]
您不應該像在html中那樣手動生成表單。 我可以看到您已經看過django表格。 我可以提出以下建議:
<form name="demo_form.asp" method="post">
{% csrf_token %}
{{ form.as_p }}
<button type="submit" value="continue">Submit</button>
</form>
還有很多其他表單呈現選項 。 此方法還將確保在表單驗證失敗時自動顯示正確的消息。
另請注意,我已將GET更改為POST。 最好將post用於表單。 如果您未安裝csrf中間件,則我已添加{%csrf_token%}刪除此選項。
在模板中,在定義任何input
元素之前,將關閉form
,因此,表單將不包含作為表的一部分輸入的任何數據。
您可以通過將</form>
結束標記移動到表末尾的某個位置來解決此問題。
此外, <input>
標記沒有name
屬性,因此在輸入元素中輸入的所有值均不能在HTTP請求中傳遞。 例如,表的第一行可以寫為:
<tr>
<td>1</td>
<td>Abijith</td>
<td>
<input type="number" id="aNumber" name="aNumber">
<button onclick="aFunction()"><font color="green">Present</button>
<button onclick="abFunction()"><font color="red">Absent</button>
<input type="number" id="abNumber" name="abNumber">
</td>
</tr>
請注意, name
屬性已添加到輸入標簽。
可能還有其他問題,但這是對我而言突出的問題。
編輯
另一個問題是該視圖期望在POST請求中發送數據,但是該表單正在使用GET。 將HTML表單更改為使用method="post"
。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.