博客
关于我
强烈建议你试试无所不能的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

你可能感兴趣的文章
启动hive命令报错 “Metastore contains multiple versions”
查看>>
安全相关技术结点
查看>>
【CentOS 7笔记目录】
查看>>
家用PC机打造VSphere5.1 测试环境:之DIY攒机篇
查看>>
并发之悲观锁和乐观锁的使用
查看>>
apply、call、bind区别、用法
查看>>
烂泥:mysql5.5数据库cmake源码编译安装
查看>>
MongoDB 集群(一)
查看>>
仿锤子M1的BigBang功能源码实现
查看>>
pl/sql developer连接ORACLE数据库(64位)
查看>>
关于WEBGL的那点破事
查看>>
自动牛皮纸封装机—TPYBoard在MicroPython上的工业级成功应用
查看>>
我的友情链接
查看>>
Mybatis批量插入数据
查看>>
linux搭建yum源服务器
查看>>
RMI结合HAProxy的实际应用及问题解决的思路
查看>>
关于安全运维的思考
查看>>
cisco--DHCP服务配置
查看>>
EMC开源产品rexray
查看>>
Module *** must not contain source root "...P
查看>>