ajax异步请求查询操作
来源:互联网 发布:加拿大生物专业知乎 编辑:程序博客网 时间:2024/06/16 05:21
大概的思路是这样的,这也是我项目中的经历:
1.前端首先获取到输入的input框的值
2.ajax异步发送请求去后端接口
3.相应的接口处理逻辑,返回json
4.前端判断相应值并且渲染页面
HTML代码
<div class="item form-group"> <label for="phone" class="control-label col-md-3 col-sm-3 col-xs-12">来电电话 <span class="required">*</span></label> <div class="col-md-6 col-sm-6 col-xs-12"> <input type="text" id="phone" name="phone" value="{$cc_info.phone}" required="required" class="form-control col-md-7 col-xs-12" data-validate-length-range="4" placeholder="至少2个中文字符"> </div></div>
js代码
$('#phone').blur(function(){ var phone = $(this).val(); if ( phone == '' ) { return; } $.get("换成自己的后端相应接口的路径" + phone, {},//这也是关键的一步吧,请求后端接口 function(res) { if ( res.code < 0 ) { $('#user_profile').val(res.message); } else if ( res.code == 0 ) { $('#user_profile').val(''); validator.mark($('#phone'), '用户不存在'); user = res.message; $("input[name='telephone']").val(user.telephone); $('#telephone').val(user.telephone); $('#net_no').val(user.net_no); $('#account').val(user.account) } else { user = res.message;// 数据渲染// alert(user.telephone); $("input[name='telephone']").val(user.telephone); $('#telephone').val(user.telephone); $('#net_no').val(user.net_no); $('#account').val(user.account); } } ); });
后端php代码
这个就不上代码了,就是逻辑处理,按自己需求处理就好
主要是这个返回,返回json格式
public function 自己的控制器名称(参数) { if ( !$certain_id ) { $this->ajaxResponse(-1, '参数不正确!'); return; }}
protected function ajaxResponse($code, $message = '', $extra = '') { $this->ajaxReturn(array('code' => $code, 'message' => $message, 'extra' => $extra)); return; }最后的ajaxReturn实际调用的就是一个json_encode(),很简单。
以上就是全部的代码实现过程,自己记录一下,简单但是很基础。
阅读全文
0 0
- ajax异步请求查询操作
- 异步请求响应操作流程(AJAX)
- ajax请求的同步和异步操作
- ajax发送异步请求(四步操作)
- ajax的同步/异步请求,以及extjs4中如何在model中实现两张无外键关联表的查询操作
- ajax操作ajax异步获取数据,查询用户数据
- Ajax发送异步请求(四步操作)
- AJAX异步请求封装
- Ajax之异步请求
- ajax 异步请求例子
- JQuery ajax异步请求
- ajax异步请求实例
- Ajax异步请求
- AJAX 异步请求
- PHP----Ajax异步请求
- PHP----Ajax异步请求
- AJAX发送异步请求
- Ajax异步请求
- C# winform 多线程 实现实时对账
- 用户画像相关
- 多段颜色的进度条实现
- IBATIS中 $与#的区别
- ffmpeg 常用命令
- ajax异步请求查询操作
- Qt笔记-QScrollBar- qss
- 冒泡排序和选择排序
- Google tensorflow object detection API install
- www.tensorflow.org 无法访问问题解决办法
- Android实现TextView跑马灯效果
- 是这两周的吗?以前大叔做饭的没法找啊,可能是和总部的混了
- 今天学习
- javaseday10(异常,object)