jQuery之Ajax异步请求
程序员文章站
2024-01-26 08:06:58
...
基于playframework1.5
路由表
# Routes # This file defines all application routes (Higher priority routes first) # ~~~~ # Home page GET / Application.index * /reg Register.reg GET /list Register.list GET /users Register.users POST /delete Register.delete * / module:secure # Ignore favicon requests GET /favicon.ico 404 # Map static resources from the /app/public folder to the /public path GET /public/ staticDir:public # Catch all * /{controller}/{action} {controller}.{action}
模型
package models;
import javax.persistence.Entity;
import play.db.jpa.Model;
@Entity
public class User extends Model {
public String username;
public String password;
public User() {
super();
}
public User(String username, String password) {
super();
this.username = username;
this.password = password;
}
}
控制器
package controllers;
import models.User;
import play.mvc.Controller;
public class Register extends Controller {
public static void reg(User user) {
if(user.username == null) {
render();
} else {
user.save();
list();
}
}
public static void list() {
render();
}
public static void users() {
renderJSON(User.findAll());
}
public static void delete(Long id) {
User user = User.<User>findById(id);
if(user!=null) {
System.out.println("delete:"+user.username);
user.delete();
}
}
}
注册页面
reg.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="@{Register.reg()}" method="post">
<p>
<label for="username">username:</label>
<input type="text" name="user.username" id="username"/>
</p>
<p>
<label for="password">password:</label>
<input type="password" name="user.password" id="password"/>
</p>
<p>
<input type="submit" value="save"/>
</p>
</form>
</body>
</html>
用户列表
点击checkbox框,后台发起请求,将对于的用户删除
获取数据用GET
传递数据用POST
list.html
#{extends 'main.html' /}
<script type="text/javascript">
$(function(){
var url = "@{Register.users}";
//get方式 : url, callback function
$.get(url,function(data,status){
if(status=="success") {
$.each(data,function(idx,item){
$("body").append("<p><input type='checkbox' value='"+item.id+"'/>"+item.username+":"+item.password+"</p>");
})
}
});
$("p").live("click",function(){
var currentNode = $(this);
//当p区域被处理过之后,就不再向后台发起请求了
if($(":checked",currentNode).attr("disabled")!="disabled") {
var url = "@{Register.delete()}";
//post方式 :url , params , callback function
$.post(url,{
id: $(":checked",this).val()
},
function(data,status) {
if(status=='success') {
$(":checked",currentNode).attr("disabled","true");
$(currentNode).css("background-color","red");
//$(currentNode).slideToggle();
}
});
}
});
});
</script>
<a href="@{Register.reg()}">继续</a>
下一篇: PHP 字符串与二进制互转