zoukankan      html  css  js  c++  java
  • 控制层和ajax用法的详解

    商城项目第二天复习的内容

    package cn.tedu.store.entity;
    
    public class ResponseResult<T> {
    
    public static final int STATE_OK = 1;
    public static final int STATE_ERR = 0;
    
    private Integer state;
    private String message;
    private T data;
    
    public ResponseResult() {
    super();
    }
    
    public ResponseResult(Integer state) {
    super();
    this.state = state;
    }
    
    public ResponseResult(
    Integer state, String message) {
    super();
    this.state = state;
    this.message = message;
    }
    
    public ResponseResult(Integer state, T data) {
    super();
    this.state = state;
    this.data = data;
    }
    
    public ResponseResult(Throwable throwable) {
    super();
    this.state = STATE_ERR;
    this.message = throwable.getMessage();
    }
    
    public Integer getState() {
    return state;
    }
    
    public void setState(Integer state) {
    this.state = state;
    }
    
    public String getMessage() {
    return message;
    }
    
    public void setMessage(String message) {
    this.message = message;
    }
    
    public T getData() {
    return data;
    }
    
    public void setData(T data) {
    this.data = data;
    }
    
    }

    说明:
    0~1状态 失败成功状态
    添加一个带参数的构造方法

    构造方法的作用是什么?看王克晶笔记或视频
    为了快速创建对象出来,有了构造函数之后

    //出于规范性
    public ResponseResult(){
    
    }
    
    //成功
    public ResponseResult(Integer state){
    super();
    this.state=state;
    }
    
    //有了这个就可以快速地new一个出来对象出来了
    
    
    //失败
    public ResponseResult(Integer state,String message){
    //错误和错误的提示信息
    super();
    this.state=state;
    this.message=message;
    }
    
    //
    public ResponseResult(Integer state,T data){
    //表示成功的时候还有数据
    super();
    this.state=state;
    this.data=data; 
    }
    
    public ResponseResult(Throwable throwable){
    super();
    }

    -----------------------------------------------------------------------------------------------------------------------------

    package cn.tedu.store.controller;
    
    import javax.servlet.http.HttpSession;
    
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.ModelMap;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.bind.annotation.ResponseBody;
    
    import cn.tedu.store.entity.ResponseResult;
    import cn.tedu.store.entity.User;
    import cn.tedu.store.service.IUserService;
    import cn.tedu.store.service.ex.ServiceException;
    import cn.tedu.store.service.ex.UsernameConflictException;
    
    @Controller
    @RequestMapping("/user")
    public class UserController extends BaseController {
    
    @Autowired//按照类型自动注入属性的值,按照类型来查找和装配元素
    private IUserService userService;
    //控制器层要调用业务层对象,所以要有业务层对象,
    //把前面的依赖注入的例子好好地看看,默写相关例子
    
    @RequestMapping("/reg.do")
    public String showReg() {//转发显示注册页面 显示请求页面的处理
    return "register";
    }
    
    @RequestMapping("/login.do")
    public String showLogin() {
    return "login";
    }
    
    @RequestMapping("/change_password.do")
    public String showChangePassword() {
    return "user_password";
    }
    
    @RequestMapping("/change_info.do")
    public String showChangeInfo(
    ModelMap modelMap,
    HttpSession session) {
    // 从session中获取当前用户的id
    Integer id = getUidFromSession(session);
    // 根据id获取当前用户的信息
    User user = userService.findUserById(id);
    // 判断是否获取到用户数据,因为可能在登录后,数据被管理员删除
    if (user != null) {
    // 将数据封装到ModelMap对象,以转发到前端页面
    modelMap.addAttribute("user", user);
    // 执行转发
    return "user_info";
    } else {
    // 找不到数据,极可能是被管理员删除了
    // 执行重定向
    return "redirect:../main/error.do";
    }
    }
    /**控制器层:学子商城的注册功能的处理*/
    @RequestMapping(value="/handle_reg.do",method=RequestMethod.POST)
    @ResponseBody//只要响应方式不是转发或重定型,就要使用该注解,一般是json或字符串
    public ResponseResult<Void> handleReg(
    String username,
    String password,
    String phone,
    String email,
    HttpSession session) {
    ResponseResult<Void> rr;
    
    User user = new User();
    user.setUsername(username);
    user.setPassword(password);
    user.setPhone(phone);
    user.setEmail(email);
    
    try {//注册成功 并表示请求成功
    User u = userService.reg(user);
    session.setAttribute("uid", u.getId());
    session.setAttribute("username", u.getUsername());
    rr = new ResponseResult<Void>(
    ResponseResult.STATE_OK);
    } catch (UsernameConflictException e) {//注册失败并抛出异常
    rr = new ResponseResult<Void>(e);
    }
    
    return rr;
    }

    说明:

    //输入localhost:8080/TeduStore/user/handle_reg.do? username=mike&password=123456&&phone1&email=1
    页面上显示json字符串{"state":1,"message":null,"data":null}
    控制器是响应一个对象,所以会响应成json 响应通过jackson包就会响应成json
    这些页面上的内容会在终端数据库显示

    @RequestMapping(value="/handle_login.do",
    method=RequestMethod.POST)
    @ResponseBody
    public ResponseResult<Void> handleLogin(
    String username, 
    String password,
    HttpSession session) {
    ResponseResult<Void> rr;
    try {
    User user = userService.login(username, password);
    session.setAttribute("uid", user.getId());
    session.setAttribute("username", user.getUsername());
    rr = new ResponseResult<Void>(
    ResponseResult.STATE_OK);
    } catch (ServiceException e) {
    rr = new ResponseResult<Void>(e);
    }
    return rr;
    }
    
    @RequestMapping(value="/handle_change_password.do",
    method=RequestMethod.POST)
    @ResponseBody
    public ResponseResult<Void> handleChangePassword(
    String oldPassword,
    String newPassword,
    String confirmPassword,
    HttpSession session) {
    // 声明返回值
    ResponseResult<Void> rr;
    // 检查数据的有效性
    if (newPassword != null && 
    newPassword.equals(confirmPassword) &&
    newPassword.length() >= 6 && newPassword.length() <= 16) {
    try {
    // 从session中获取当前登录的用户的id
    Integer id = getUidFromSession(session);
    // 执行修改密码
    userService.changePassword(
    id, oldPassword, newPassword);
    rr = new ResponseResult<Void>(
    ResponseResult.STATE_OK);
    } catch (ServiceException e) {
    rr = new ResponseResult<Void>(e);
    }
    } else {
    // 两次输入的新密码不一致
    rr = new ResponseResult<Void>(
    ResponseResult.STATE_ERR,
    "两次输入的新密码不一致!");
    }
    // 返回
    return rr;
    }
    
    @RequestMapping(value="/handle_change_info.do",
    method=RequestMethod.POST)
    @ResponseBody
    public ResponseResult<Void> handleChangeInfo(
    String username, 
    Integer gender,
    String phone, 
    String email,
    HttpSession session) {
    // 检查数据的有效性
    if ("".equals(username)) {
    username = null;
    }
    // 获取session中的uid
    Integer id = getUidFromSession(session);
    
    // 声明返回值
    ResponseResult<Void> rr;
    
    try {
    // 执行修改
    userService.changeInfo(id, username, gender, phone, email);
    rr = new ResponseResult<Void>(
    ResponseResult.STATE_OK);
    } catch (ServiceException e) {
    rr = new ResponseResult<Void>(e);
    }
    
    // 返回
    return rr;
    }
    
    @RequestMapping("/logout.do")
    public String handleLogout(HttpSession session) {
    // 清除session中的信息
    session.invalidate();
    // 重定向到首页
    return "redirect:../main/index.do";
    }
    }

    说明:

    1.sumbit可以用来提交表单
    <input type="sumbit">
    2.button可以提交表单
    <button ></button>

    ---------------------------------------------------------------------------------------------------------------------------------------------------------


    ###regist.jsp的显示的修改
    首先用ctrl+f搜索"注册"等相关字样,找到对应的标签定义,再根据id找到对应的响应事件函数,并定义
    引入jq包,用jq写法写函数,再然后判断是否length是否等于5(是否5个span是否都输入了相应的数字),
    用jq的方式进行ajax提交,

    引入jquery包, 再检查是否引入成功

    <script src="../js/jquery-3.1.1.min.js"></script>
    <script>
    if(length==5){
    //请求目标的路径
    var url="handle_reg.do";//服务器里面的控制器来对handle_reg.do处理注册功能,写相对路径就可以了
    //各个输入框中获取用户的输入
    var username=$("#uname").val();
    //从输入框中把值拿出来,用jq来取出值, 获取输入框的id值,这个看相对应的<input>中的id值,调用var函数
    var password= ;
    var phone= ;
    var email= ;
    //注册框中确定要提交的数据
    var data="username="+username
    +"&password="+password
    +"&phone="+phone
    +"&email="+email;
    
    $.ajax({ //提交ajax请求并处理
    "url":url,//请求路径
    "data":data,//请求数据
    "type":"POST",//请求类型
    "dataType":"json",//服务器的响应数据包的数据的返回格式 如文本格式.txt,或者是json格式
    "success":function(obj){//服务器处理请求 obj表示给回来的json对象
    if(obj.state==0){//json对象里面有个state表示响应码 用0表示失败 用1表示成功
    alert(obj.message); //表示错误信息的
    }else{
    //注册成功
    alert("注册成功!");//或者内嵌一个网页 当然肯定要再写一个网页
    }
    }
    });

    //在服务端的返回类类型ResponseResult封装了message 和 state 统一响应格式

    成年人的世界没有那么多的童话,也没有那么多的逆袭。
  • 相关阅读:
    cssReset
    CSS的一些小技巧
    前端图标神器
    单例模式
    CSS 控制Html页面高度导致抖动问题的原因
    PHP中include()与require()的区别说明
    extends和implements区别
    静态,抽象类、接口、类库
    jQuery轮播图(手动点击轮播)
    jQuery实现大图轮播
  • 原文地址:https://www.cnblogs.com/shijinglu2018/p/9664938.html
Copyright © 2011-2022 走看看