系列文章目录
文章目录
- 系列文章目录
- 07-角色维护-分页-过渡-点超链接跳转到页面
- 角色列表的页面搭建
- 08-角色维护-分页-前端-准备工作
- 创建外部的JavaScript文件
- 引入外部js文件：注意引入的路径
- ==同步异步的探讨实际应用==
- 09-角色维护-分页-前端-函数getPageInfoRemote()
- ==完美获取前端元素==
- 10-角色维护-分页-前端-函数fillTableBody()
- 异步中数据追加的问题
- 11-角色维护-分页-前端-函数generateNavigator( )和paginationCallBack( )
- 12-角色维护-关键词搜索
- 13-角色维护-新增-目标和思路（引入模态框）（下一篇）
07-角色维护-分页-过渡-点超链接跳转到页面
点超链接跳转到角色列表页面的时候不需要带参数，我们就直接在 view-controller 里面维护就好了
角色列表的页面搭建
=角色（分页）列表的页面还是去看模型，但是直接查看源代码来改造代码是不方便的
我们直接这样 选择检查
跟以前一样，这样去复制
页面有大量的假数据，留1条做模板。其余的都删掉
页面跳转的链接待会改一下
然后设置好view-controller
08-角色维护-分页-前端-准备工作
设置全局变量有什么好处，好处就是以后我们要修改的话，就只要修改这个地方就行了
创建外部的JavaScript文件
引入外部js文件：注意引入的路径
然后在js里面写一些方法
可参考Admin里面是怎么写的，不过Admin是同步，这里是异步，晚上一样不可能，但是基本上还是一样的，道理是相同的
这样就完成了所有的js大概骨架，我们实现这个功能就把它拆分成一个一个的小模块来逐个处理
同步异步的探讨实际应用
怎么改？ 把pageInfo的声明放到里面来，并且把填充的方法也放他后面如下：
方式二：改成同步你不管怎么样都要先等我先执行完（例子可以看前面我的同步异步的探讨）
所以在我们这几个场景下，异步其实也可以不设置，还没要非要加上这段"async":false, 代码的时候方式三：玩出花
09-角色维护-分页-前端-函数getPageInfoRemote()
故意写错，造成后端错误，看看前端会打印什么
根据最官方靠谱的做法其实是根据状态码（status）来进行判断
完美获取前端元素
尽量复制，手输入容易出错
最终如下
然后就可以接着往下写了
注意：js里面没有equals 直接用用双等于即可
为了避免写错，尽量复制
下面这个类是我们为统一返回JSON格式数据所做的工具类，我们来这里面复制,这个工具类在别的项目中也可以使用
两方面我们都排除了
再往下就一定是成功了
10-角色维护-分页-前端-函数fillTableBody()
扯回来
数据我们要在tbody标签里面去显示
同理，另外3个按钮也是这样做
异步中数据追加的问题
注意，异步跟我们之前的同步有一个最大的区别就是，异步是无刷新的，
我们之前的管理员维护是同步的，仔细看，页面是会刷新的
这样就会有一个问题，我们点击页码导航条的时候，比如点一下下一页
，因为没有刷新，旧数据一直在，所以就会导致，数据一直追加
所以我们在前面还得做一个操作
注意清空旧数据的位置，是方法的最前面，每次调用才去清空，不要写在for循环里面，不然就永远只有最后一条数据了
重启服务，看下效果，有问题及时处理
下面是分页页码导航条
11-角色维护-分页-前端-函数generateNavigator( )和paginationCallBack( )
在前一个方法里面一定得先去调用一下
这里也可以参考我们之前的Admin，管理员/用户维护的分页页码是怎么写的
从前端也可以看出来
这里可以复制admin-page.jsp 页面的代码来，注意区分他们的不同之处，
也是同步的写法和异步的写法的区别
注意，跟同步的区别，异步不需要跳转页面
检查一下是否漏掉了css和js
效果如下：
12-角色维护-关键词搜索
13-角色维护-新增-目标和思路（引入模态框）（下一篇）
14-角色维护-新增-代码：前端
15-角色维护-新增-代码：后端
16-角色维护-新增-小结
17-角色维护-更新-目标和思路
18-角色维护-更新-代码：前端-给铅笔按钮绑定单击响应函数
19-角色维护-更新-代码：前端-打开模态框
20-角色维护-更新-代码：前端-执行更新
21-角色维护-更新-代码：后端-执行更新
22-角色维护-删除-目标和思路
23-角色维护-删除-代码：后端
24-角色维护-删除-代码：前端-打开模态框
25-角色维护-删除-代码：前端-执行删除
26-角色维护-删除-代码：前端-单条删除
27-角色维护-删除-代码：前端-批量删除-全选全不选功能
28-角色维护-删除-代码：前端-批量删除-收集要删除的信息
29-角色维护-删除-小结