登录和注册功能总结完后就到了签到功能了,做签到功能的话就得新建一张用来签到的表,我给它命名叫:Duty。
签到功能是在登录成功后的页面,登录成功后跳转到另一个页面,页面上有三个输入框一个是用户名、一个是签到日期、一个是考勤类型。加上一个签到按钮一个签退按钮一个查询按钮。点击签到按钮后向后台发送数据所以给签到按钮添加一个单击事件(onclick)并用ajax技术发送,而不是用form表单方式传送了。在点击签到按钮后往数据库增加一条你签到的数据记住这时候还没有点击签退,签到完后签退字段的值应该是没有的是空,所以给他个默认值null(注意不要忘了引用jQuery)
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
//给按钮signin绑定单击事件,实现签到功能
$(function() {
$("#signin").click(
function() {
var uname1 = $("#username").val();
//发送ajax请求,完成签到,并通过回调函数显示结果
$.ajax({
data : {
"uname" : uname1},
url : "duty",
type : "post",
dataType : "text",
success : function(n) {
//显示签到结果
if (n == 1) {
alert("签到成功");
queryDuty();
} else {
alert("你已签到无需重复签到")
}
}
});
});
<body>
<input type="hidden" name="username" id="username"
value="${user.uname}">
<form>
用户名 <input type="text" id="queryUname" name="queryUname"> 签到日期
<input type="text" name="date" id="date"> 考勤类型<input
type="text" name="normal" id="normal" list="mold" autocomplete="off">
<datalist id="mold">
<option value="正常">
<option value="异常">
</datalist>
<input name="" type="button" class="btn" value="查询" id="showduty">
<input name="" type="button" class="btn" value="签到" id="signin">
<input name="" type="button" class="btn" value="签退" id="signout">
</form>
<body