编辑用户
1、点击编辑按钮
流程:
(1)、禁用编辑的herf,避免跳转到其他网页
href="javascript:void(0)"
(2)、需要给“编辑”按钮添加class 为btn-update-user
(3)、编辑js ===》点击编辑按钮时 发生的事件为:1、将id传给服务器。2、返回数据显示 ===》ajax
先取得id的值
var id = jQuery(this).attr(‘update-id‘);
var form = jQuery(‘.form-update-user‘); #定义找到from表单
设置id值,找到name=id的,并将value=result[‘result‘][‘id‘]
form.find(‘[name=id]‘).val(result[‘result‘][‘id‘]);
if (result[‘result‘][‘sex‘]) {
form.find(‘[name=sex][value=1]‘).prop(‘checked‘, true);
}
else {
form.find(‘[name=sex][value=0]‘).prop(‘checked‘, true);
}
(result[‘result‘][‘sex‘] =1时(为男),则为true ,此时找到元素 [name=sex][value=1] ,prop是将‘checked‘ 设置为true,表示显示男的按钮,为false,则不显示为男的按钮
以上是点击编辑按钮获取的值。
2、点击保存
将数据通过ajax的方式传送给服务器,并返回结果到前端
var data = jQuery(‘.form-update-user‘).serializeArray();
console.log(data);
jQuery.post("{% url ‘user:update_ajax‘ %}", data, function (result) {
这里就写if result[‘code‘] == 200 400 403
},‘json‘);
jQuery.post jQuery.get 区别:
jQuery.get:将所有信息明文传输到服务器上,不安全,速度快,有缓存
jQuery.post:将密文传输,速度慢,安全
原文地址:http://blog.51cto.com/jacksoner/2136914