博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
雨燕权限管理前端技术总结
阅读量:6603 次
发布时间:2019-06-24

本文共 6546 字,大约阅读时间需要 21 分钟。

1,url数量,

  • list,show这些页面可以直接显示数据的,使用get,model返回数据
  • save,login,regiset直接打开一个填充表页面,使用get,直接跳转一个jsp
  • save.json,login.json,regiset.json提交数据,使用ajax ,post,根据返回信息由前端跳转
  • 总结:有几个页面就有几个get方法,页面有几个提交就有几个匹配的post方法,

2,jsp相关

  • jstl标签添加
    <%@ page language="java" contentType="text/html;charset=UTF-8"         pageEncoding="UTF-8" %><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %><%@ taglib uri="http://java.sun.com/jsp/jstl/xml" prefix="x" %><%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %><%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %><%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
    View Code

     

  • url这个时候是被springmvc控制的,如user/admin/list,现在游标在list,使用静态资源要回退两格,
    href="../../user/css/common
  • if标签,
    性别:                        
    全选
    View Code

     

  • forEach标签,使用枚举时候引入相关类
    <%@page import="com.liepin.ycdemo.platform.user.enums.EnumGender" %>
    ${tform.name} ${tform.gender.desc} ${tform.phone} ${tform.position} ${tform.state.desc} ${tform.role.desc}
    修改
    删除
    查看
    View Code

     

  • 自动for循环
    View Code

     

  • Java 的model方面
    model.addAttribute("condition4Name", name);        model.addAttribute("condition4Phone", phone);        model.addAttribute("condition4Gender", gender);        model.addAttribute("userList", employeeDtoListQuery.getList());        model.addAttribute("rowCount", employeeDtoListQuery.getTotalCount());        model.addAttribute("pageSize", pageSize);        model.addAttribute("curPage", curPage);        model.addAttribute("totalPage", PageUtil.calTotalPage(pageSize, employeeDtoListQuery.getTotalCount()));        return "user/management";
    View Code

     

3,html相关

  • 官方提交按钮,submit,用于提交表单,a标签也可以
    View Code
    View Code

     

  • 官方跳转标签
    View Code

     

  • 官方输入框
    View Code

     

  • 官方单选框
    View Code

     

  • 官方文件处理
    View Code

     

  • 官方勾选框checkbox
    View Code

     

  • 官方分页,jsp版本

     

  • 官方大输入框text area,回显不能写value里面
    View Code

     

4,js相关

  • jq获得文件
    var file = $('#file')[0].files[0]
    View Code

     

  • jq获得普通
    var introduce = $('#introduce').val();
    View Code

     

  • jq获得checkbox,勾选框,没有值 的时候undefined
    var isAutoLogin = $("input[name='isAutoLogin']:checked").val();
    View Code

     

  • jq获得raido,单选框,
    var gender = $("input[name='gender']:checked").val();
    View Code

     

5,策略

  • 普通ajax,注意ajax的url要写全http这些
    var username = $('#username').val();    var password = $('#password').val();    var position = $('#position').val();    var email = $('#email').val();    var birthday = $('#birthday').val();    var name = $('#name').val();    var phone = $('#phone').val();    var gender = $("input[name='gender']:checked").val();    if (username == '' || password == '' || position == '' || email == '' || birthday == '' || name == '' || phone == '' || gender == '') {        alert('有信息尚未填写好')        return;    }    console.log(username, password, position, email, birthday, name, phone, gender);    var formData = new FormData();    formData.append("username", username);    formData.append("password", password);    formData.append("position", position);    formData.append("email", email);    formData.append("birthday", birthday);    formData.append("name", name);    formData.append("phone", phone);    formData.append("gender", gender);    $.ajax({        url: 'http://localhost:8080/auth/register.json',        type: 'POST', //GET        data: formData,        timeout: 10000,    //超时时间        contentType: false,//这里        processData: false,//这两个一定设置为false        beforeSend: function (xhr) {        },        success: function (data, textStatus, jqXHR) {            console.log(data);            if (data.data != 'SUCCESS') {                alert(data.data)            } else {                alert("注册成功,跳转到登录页")                setTimeout(function() { window.location.href="/auth/login" }, 1000);            }        },        error: function (xhr, textStatus) {            console.log('错误')            console.log(xhr)            console.log(textStatus)        },        complete: function () {        }    })
    View Code

     

  • 当有under fined上传影响入参的时候,不让她加入formdata
    if(userAddtionalId != undefined){        formData.append("userAddtionalId", userAddtionalId);    }
    View Code

     

  • ajax显示不是正确的返回,+延时跳转
    if (data.data != 'SUCCESS') {                alert(data.data)            } else {                alert("成功")                setTimeout(function() { window.location.href="/user/showAddtional?userId="+ userId }, 1000);            }
    View Code

     

转载于:https://www.cnblogs.com/vhyc/p/10567340.html

你可能感兴趣的文章
C#编程(四十七)----------集合接口和类型
查看>>
【转】关于大型网站技术演进的思考(十二)--网站静态化处理—缓存(4)
查看>>
积跬步,聚小流------Bootstrap学习记录(1)
查看>>
HDUPhysical Examination(贪心)
查看>>
HTML5 FileAPI
查看>>
使用tdcss.js轻松制作自己的style guide
查看>>
SecureCRTPortable.exe 如何上传文件
查看>>
C++中public、protected及private用法
查看>>
苹果公司的产品已用完后门与微软垄断,要检查起来,打架!
查看>>
顶级的JavaScript框架、库、工具及其使用
查看>>
AYUI -AYUI风格的 超美 百度网盘8.0
查看>>
简明 Python 教程
查看>>
用MPMoviePlayerController做在线音乐播放
查看>>
Java查找算法——二分查找
查看>>
如何构建微服务架构
查看>>
【前端笔记】彻底理解变量与函数的声明提升
查看>>
Android 反编译利器,jadx 的高级技巧
查看>>
二叉搜索树(递归实现)
查看>>
Spring Retry重试机制
查看>>
Android官方架构组件LiveData: 观察者模式领域二三事
查看>>