SSM-整合练习

第20：创建员工新增的模态框

为新增按钮添加点击事件：效果是弹出一个对话框内容如下：
利用bootstrap：三行
第一行：标题置左：员工添加
第二行：form表单：lastName 文本框
email 文本框
gender 单选框
department 下拉列表 都是根据bootstrap的说明来添加
第三行：置右 保存和关闭按钮两个

其中department的下拉数据需要和数据库完成数据交互
构建对话框我们用bootstrap的javascript插件中的模态框

通过bootsrap文档帮助我们可以了解构建过程：

在button按钮的下面加入模态框代码，可以得到如下图上的模型对话框。只需要在代码中添加需要的html代码即可
提供了两种激活的方式：
一种是在button中设置Launch modaldata-toggle属性我们要选择modal，data-target数据目标我们要任意填写一个名字。
一种是在js代码中加入$(’#定义的id’).modal(options)**方便下面调用。
option属性：有两个是可以设置
设置表单信息：可以通过bootstrap提供的表单实例
我们选择水平表单：

第三行和第四行我们选择内联单选和下拉列表

整个form表单需要提交的参数值，的name属性需要根据实体类中的对象属性进行命名。MVC可以直接获取。
需要获得ajax查出的部门信息就需要在执行点击事件的第一步就发送ajax请求， 获得部门信息的返回。

第五步保存的单击事件，控制器功能是添加用户数据。
如何快速找到标签元素而不去设定元素的id值，找到父元素的id值，并且子元素是唯一的可以定位的$("#myModal form")，myModal的子元素form元素的选定
通过一个jquery方法:serialize() 序列表表格内容为字符串，用于 Ajax 请求。
Restful风格 在控制器的方法添加方法的POST请求是向服务器添加一个资源，PUT
请求是向服务器更新一个资源,GET请求是向服务器查找一个资源，DELETE请求是向服务器删除一个资源。Get@RequestMapping(value=“add_emp”,method=RequestMethod.POST)
保存成功后需要两个补充设置：自动关闭对话框。在bootstrap文档中有模态框一项：

利用这个方法写在ajax请求函数中的success的function回调函数中。
当保存完毕还需要立即跳转到末页：直接应用js设定函数的_page(页码)的函数
向服务器发送ajax请求到末页：这里页码需要填写最大的数字。

第23：jquery的前端校验
在模态框中输入form表单数据的时候同时进行数据的校验操作：
在保存的点击事件回调函数中，发送ajax请求之前进行员工的校验工作。
书写校验函数:
利用的校验方式是正则表达式的逻辑校验：函数是 regixp.test(str)
首先获得 str=$("# ").val();