tp5实现ajax异步添加数据
2020-03-31 本文已影响0人
zhaoxiaohui520
tp5实现ajax异步添加数据
ajax异步无刷新处理数据的用户体验还是不错的，在我们的项目开发中算是经常使用到的一个知识点。所以做成了ajax异步添加，我们平常用到的可能都是ajax异步删除、异步修改，异步添加可能稍微少点，下面看看我们的处理逻辑和核心代码吧。
这是我们数据添加的界面：
image
前端js代码如下：
<pre style="box-sizing: border-box; overflow: auto; font-family: Consolas, Inconsolata, Courier, monospace; font-size: 14px; display: block; padding: 8px; margin: 0px 0px 24px; line-height: 22px; color: rgb(0, 0, 0); word-break: break-all; overflow-wrap: break-word; background-color: rgb(245, 245, 245); border: 1px solid rgb(204, 204, 204); border-radius: 4px; position: relative; white-space: pre-wrap;">[js]
<script type="text/javascript">
function adddhm(){
var oid=$("input[name='oid']").val();
var uname=$("input[name='uname']").val();
var dhm=$("input[name='dhm']").val();
var _class=$("select[name='class']").val();
var otime=$("input[name='otime']").val();
if(!oid){
alert('订单号不能为空！');
return false;
}
if(!uname){
alert('用户名不能为空！');
return false;
}
if(!dhm){
alert('兑换码不能为空！');
return false;
}
if(!_class){
alert('适用课程不能为空！');
return false;
}
if(!otime){
alert('下单时间不能为空！');
return false;
}
$.ajax({
type:"POST",
data:{oid:oid,uname:uname,dhm:dhm,class:_class,otime:otime},
url:"{:url('add')}",
success:function(data){
alert(data.msg);
}
});
$("#myform")[0].reset() ;
return false;
}
</script>
[/js]</pre>
下面是我们接受到数据后的添加逻辑：
<pre style="box-sizing: border-box; overflow: auto; font-family: Consolas, Inconsolata, Courier, monospace; font-size: 14px; display: block; padding: 8px; margin: 0px 0px 24px; line-height: 22px; color: rgb(0, 0, 0); word-break: break-all; overflow-wrap: break-word; background-color: rgb(245, 245, 245); border: 1px solid rgb(204, 204, 204); border-radius: 4px; position: relative; white-space: pre-wrap;">[php]
public function add()
{
if(request()->isPost()){
$_data=input('post.');
$data=array();
foreach ($_data as $k => $v) {
$data[$k]=trim($v);
}
$validate = validate('dhm');
if(!$validate->check($data)){
$msg=$validate->getError();
return json(['error'=>2,'msg'=>$msg]);
}
$add=db('dhm')->insert($data);
if($add){
return json(['error'=>0,'msg'=>'添加成功！']);
}else{
return json(['error'=>1,'msg'=>'添加失败，请重新添加！']);
}
return;
}
return view();
}
[/php]</pre>
