CRUD（29）：修改-更新按钮的完成

一、更新按钮绑定事件

二、校验邮箱

       //为更新按钮绑定事件

       $("#emp_update_btn").click(function{           

                 //1.校验邮箱

                    var email = $("#email_update_input").val();

                    var regEmail = 
/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/;

                    if (!regEmail.test(email)) {

                           show_validate_msg("#email_update_input", "error",

                                        "jquery:请输入正确的邮箱格式，如abc@qq.com");

                           return false;

                    } else {

                           show_validate_msg("#email_update_input", "success",

                                        "jquery:邮箱格式正确！");

                    }

                    

       });

三、发送ajax请求保存更新的员工数据

①在EmployeeController中新增更新员工的方法；

       //保存员工（修改-更新按钮）

       @RequestMapping(value = "/emp/{empId}", method = RequestMethod.PUT)

       @ResponseBody

       public Msg updateEmp(Employee employee) {

             employeeService.updateEmp(employee);

             return Msg.success();

       }

②在EmployeeService中创建这个更新方法；

       //更新员工数据（修改-更新按钮）

       public void updateEmp(Employee employee) {

             employeeMapper.updateByPrimaryKeySelective(employee);

       }

       

员工id传递到更新按钮上：

                    $("#emp_update_btn").attr("edit-id",$(this).attr("edit-id"));

把EmployeeController中的id改成empId:

@RequestMapping(value = "/emp/{empId}", method = RequestMethod.GET)

PUT请求不能直接发,Tomcat一看是PUT请求，不会封装请求体中的数据为map，只有POST形式的请求才封装请求体为map。

对于此，springmvc有一个HttpPutFormContentFilter的过滤器。

在web.xml中配置这个过滤器：

       <!--5.封装前台传递过来的PUT请求的参数 -->

       <filter>

             <filter-name>HttpPutFormContentFilter</filter-name>

             <filter-class>org.springframework.web.filter.HttpPutFormContentFilter</filter-class>

       </filter>

       <filter-mapping>

             <filter-name>HttpPutFormContentFilter</filter-name>

             <url-pattern>/*</url-pattern>

       </filter-mapping>

创建一个“本页面”变量，给它赋值：

currentPage = result.extend.pageInfo.pageNum;

写ajax请求：

                    //发送ajax请求更新员工数据

                    $.ajax({

                           url:"${APP_PATH}/emp/"+$(this).attr("edit-id"),

                           type:"PUT",

                           data:$("#empUpdateModal form").serialize(),

                           success:function(result){

                                 //关闭模态框

                                 $("#empUpdateModal").modal('hide');

                                 //回到本页面

                                 to_page(currentPage);

                                 alert(result.msg);

                           }

                    });

做完啦。