(九)play之yabe项目【发表博文】

(九)play之yabe项目【发表博文】

博客分类：

• 框架@play framework

 

发表一篇博文

填充管理页面

从主页链接到管理页面时，只简单显示了登陆用户的名称

现在对显示的内容加以丰富

修改Admin中的index()

1. package controllers;
2. import java.util.List;
3. import models.Post;
4. import models.User;
5. import play.mvc.Before;
6. import play.mvc.Controller;
7. public class Admin extends Controller {
8. /**
9. * 首先，用户登陆会被Security拦截，登陆成功会把username放入session中
10. * session.put("username",username);
11. * 通过session.contains("username");判断用户是否已经登陆
12. *
13. * @Before 访问Admin控制器时，将先执行由该注解标注的方法，进行拦截（过滤/检查）
14. */
15. @Before
16. static void setConnectedUser() {
17. //Security.isConnected() 检查session中是否有username为key的map存在
18. //因为用户登陆后会用username作为key存储登陆信息
19. if(Security.isConnected()) {
20. //Security.connected() 取得session中以username为key的value，即用户名
21. User user = User.find("byUsername", Security.connected()).first();
22. renderArgs.put("user", user.fullname);
23. }
24. }
25. /**
26. * 返回管理CRUD功能模块的主页面
27. * 查询属于当前登陆用户的博文
28. * 传递到admin/index.html页面进行显示
29. */
30. public static void index(){
31. String username = Security.connected();
32. //Post对象的author属性为User类型
33. List<Post> posts = Post.find("author.username", username).<Post>fetch();
34. render(posts);
35. }
36. }

同样，编辑yabe\app\views\Admin\index.html，对新增内容进行显示

1. #{extends 'admin.html' /}
2. <!-- 显示用户及其发布的博文数量 -->
3. <h3>
4. Welcome ${user},
5. <span>
6. you have written
7. ${posts.size() ?: 'no'}
8. ${posts.pluralize('post','posts')}
9. so far!
10. </span>
11. <!-- posts.pluralizer(x,y) : posts的size为单数，则返回x，否则返回y-->
12. </h3>
13. <!-- 循环posts，分别显示每个博文 -->
14. #{list items:posts, as:'post'}
15. <p class="post ${post_parity}">
16. <a href="#">${post.title}</a>
17. </p>
18. #{/list}
19. <!-- 创建新的博文 -->
20. <p id="newPost">
21. <a href="#"><span>+</span>write a new post</a>
22. </p>

进入管理页面http://localhost:9000/admin/index

显示了当前博主发布博文情况，以及发布新博文的按钮

发表一篇博文

三步：

创建Controller，或在Controller中加入action

给action配置路由

编写action对应的模板

在Admin中编写action，一个用于返回一个form表单；一个用于接收form提交的参数

1. /**
2. * 返回form的页面
3. */
4. public static void form() {
5. render();
6. }
7. /**
8. * 接收form提交的数据并处理
9. */
10. public static void save(String title, String content) {
11. //current login user
12. User author = User.find("byUsername", Security.connected()).first();
13. //new post
14. Post post = new Post(title, content, author);
15. //Validate
16. validation.valid(post);
17. if(validation.hasErrors()) {
18. //一种简写，等效于 render("Admin/form.html",post);
19. render("@form",post);
20. }
21. //Save object
22. post.save();
23. index();
24. }

配置路由

1. #form
2. #open a form page use get method
3. GET     /admin/new      Admin.form
4. #submit form use post method
5. POST            /admin/new      Admin.save

编写模板-form表单

1. #{extends 'admin.html' /}
2. <h3>Write,<span>a new post</span></h3>
3. #{form @save()}
4. #{ifErrors}
5. <p class="error">
6. Please correct these errors.
7. </p>
8. #{/ifErrors}
9. <p>
10. #{field 'title'}
11. <label>Post title:</label>
12. <input type="text" name="${field.name}" value="${post?.title}" />
13. <span class="error">#{error 'post.title' /}</span>
14. #{/field}
15. </p>
16. <p>
17. #{field 'content'}
18. <label>Write here:</label>
19. <textarea name="${field.name}">${post?.content}</textarea>
20. <span class="error">#{error 'post.content' /}</span>
21. #{/field}
22. </p>
23. <p>
24. <input type="submit" value="Publish this post to the blog" />
25. </p>
26. #{/form}

刷新页面，点击创建一个新的博文

修改admin/index.html，为每个博文设置链接

注意：这里需要传入博文的id，以便后台查询出该博文的所有信息，再返回Post对象给页面进行显示

1. <!-- 循环posts，分别显示每个博文 -->
2. #{list items:posts, as:'post'}
3. <p class="post ${post_parity}">
4. <a href="@{Admin.form(post.id)}">${post.title}</a>
5. </p>
6. #{/list}

修改Admin控制器中的form()，接收id参数

如果id != null ,表示数据库中已经存在此博文，可以查询出来

用于页面的回显

1. /**
2. * 返回form的页面
3. * 初次创建博文，id为空，不返回对象
4. * id不为空，则查询出对象，传递到页面用作数据回显
5. */
6. public static void form(Long id) {
7. if(id!=null) {
8. Post post = Post.findById(id);
9. render(post);
10. }
11. render();
12. }

修改路由，定制更好看的URL

http://localhost:9000/admin/new?id=6

增加路由

1. #open a form page use get method
2. GET     /admin/myPosts/{id} Admin.form
3. GET     /admin/new      Admin.form

第1条路由：如果一个id参数被提交，将使用第1条路由模式显示URL=== myPosts/6

第2条路由：如果没有id参数被提交，则使用旧的模式显示URL=== new?id=6

之后，URL变为了这种格式：http://localhost:9000/admin/myPosts/6

 区分创建与编辑

现在还存在一个问题，新建博文没有问题了

但是，编辑已经存在的博文，保存之后系统会自动将其作为一个新的博文进行发布，而不是更新

因此，需要在form()中加入判断逻辑：

如果已经存在id了，则更新；否则作为新的博文进行保存！

修改Admin控制器的save()，处理创建与编辑两种情况

1. /**
2. * 接收form提交的数据并处理
3. * 增加id参数，由页面传递过来
4. * 通过id参数是否为空，判断是新建保存还是编辑保存
5. */
6. public static void save(Long id, String title, String content) {
7. Post post = null;
8. if(id==null) {
9. //创建
10. User author = User.find("username", controllers.Secure.Security.connected()).first();
11. post = new Post(title, content, author);
12. } else {
13. //更新---取出已有对象，更新其内部属性并同步到数据库
14. post = Post.findById(id);
15. post.title = title;
16. post.content = content;
17. }
18. //Validate
19. validation.valid(post);
20. if(validation.hasErrors()) {
21. //一种简写，等效于 render("Admin/form.html",post);
22. render("@form",post);
23. }
24. //Save object
25. post.save();
26. index();
27. }

修改form.html模板，加入创建与编辑的不同显示，同时增加id参数的传递

以便后台判断是新建还是编辑已有博文

1. #{extends 'admin.html' /}
2. <!--
3. 判断post对象id是否为空
4. id==null,则新建博文
5. id!=null,则编辑博文
6. -->
7. #{ifnot post?:id}
8. <h3>Write,<span>a new post</span></h3>
9. #{/if}
10. #{else}
11. <h3>Edit,<span>this post</span></h3>
12. #{/else}
13. <!-- 把id传到 Admin控制器的save action中 -->
14. #{form @save(post?.id)}
15. #{ifErrors}
16. <p class="error">
17. Please correct these errors.
18. </p>
19. #{/ifErrors}
20. <p>
21. #{field 'title'}
22. <label>Post title:</label>
23. <input type="text" name="${field.name}" value="${post?.title}" />
24. <span class="error">#{error 'post.title' /}</span>
25. #{/field}
26. </p>
27. <p>
28. #{field 'content'}
29. <label>Write here:</label>
30. <textarea name="${field.name}">${post?.content}</textarea>
31. <span class="error">#{error 'post.content' /}</span>
32. #{/field}
33. </p>
34. <p>
35. <input type="submit" value="Publish this post to the blog" />
36. </p>
37. #{/form}

点击创建一个新的博文

点击一个已存在的博文

同样，将编辑博文的URL路径显示风格进行改变

修改routes文件

带id参数提交时的将使用第1条路由，不带参数则按第2条路由显示URL

1. #submit form use post method
2. POST    /admin/myPosts/{id} Admin.save
3. POST    /admin/new      Admin.save

创建新的博文，保存时的URL使用第1条路由：

http://localhost:9000/admin/myPosts/1 (POST提交)

编辑已存在的博文，保存时的URL使用第2条路由：

http://localhost:9000/admin/new (POST提交)