ajax批量删除

最新推荐文章于 2021-08-05 14:32:23 发布

独守空城念旧人

最新推荐文章于 2021-08-05 14:32:23 发布

阅读量344

点赞数 1

分类专栏： laravel框架文章标签： 1024程序员节

本文链接：https://blog.csdn.net/fsp69/article/details/109264972

版权

laravel框架专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文详细介绍了如何在Laravel框架中实现用户登录、验证码生成与验证、富文本编辑、图片上传与下载以及Ajax删除和批量删除功能。还涉及到Excel导出和饼状图展示。通过实例代码展示了每个功能的实现步骤，对于理解Laravel后端与前端交互有很好的帮助。

摘要由CSDN通过智能技术生成

Laravel内置登录方法

1.config--->auth.php修改配置
2.模型层使用配置好的auth
3.auth的基本使用方法：
	3.1 auth->attempt()  实现登录    两个参数（username,password）密码必须是bcrypt加密
	3.2 auth->check()    检测是否登录
	3.3 auth->logout()   清除缓存、退出登录

在这里插入图片描述

Laravel内置验证码

1.安装扩展 composer require “mews/captcha:~2.0”
2.安装完成后执行:$ php artisan vendor:publish 生成配置文件config/captcha

视图层如下:

  <input class="input-text size-L" type="text" placeholder="验证码" style="width:150px;" name="captcha">
  <img class="thumbnail captcha" src="{{ captcha_src('flat') }}" onclick="this.src='/captcha/flat?'+Math.random()" title="点击图片重新获取验证码">

验证:

  $this->validate($request,[
          'captcha' => 'required|captcha'
      ],[
          'captcha.required' => '验证码必填',
          'captcha.captcha' => ' 请输入正确的验证码'
      ]);

富文本框使用

官方网址:http://fex.baidu.com/ueditor/.
私人链接:http://m.caomeipi.com.（已下载好的ueditor富文本框，引入既用）

<form action="{{route('admin.docreate')}}" method="post" enctype="multipart/form-data">
    {{csrf_field()}}
        <table class="table table-bg">
            <tr>
                <th class="text-r">内容：</th>
                <td><textarea  name="ctx" id="body" style="width: 500px"></textarea></td>
            </tr>
        </table>
</form>
</body>
</html>

<script type="text/javascript" src="/ueditor/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="/ueditor/ueditor.all.js"></script>
<script>
    var ue = UE.getEditor('body', {
        autoHeight: false
    });
</script>

效果如下:

在这里插入图片描述

上传图片且限制大小、下载

视图层:

<form action="{{route('admin.docreate')}}" method="post" enctype="multipart/form-data">

	<input type="file" name="img>
	
</form>

控制器:
在这里插入图片描述
下载:

response()->download($img);    //$img是图片的地址

ajax删除

视图层

  <html>
 		 <a href="{{route('admin.del',['id'=>$v->id])}}" class="btn btn-danger radius del">删除</a> 	
 </html>

   <script>
    // 生成一个token crsf
    const _token = "{{ csrf_token() }}";   

    // 给删除按钮绑定事件
    $('.del').click(function (evt) {
        // 得到请求的url地址
        let url = $(this).attr('href');
        // 发起一个delete请求
        $.ajax({
            url,
            data: {_token},
            type: 'delete',     //请求方式
            dataType: 'json'    //数据格式
        }).then(({status, msg}) => {
            if (status == 0) {
                // 提示插件
                layer.msg(msg, {time: 2000, icon: 1}, () => {
                    // 删除当前行
                    $(this).parents('tr').remove();     //移除
                });
            }
        });
        // jquery取消默认事件
        return false;
    });
    </script>

控制器

 public function del(int $id){
        Users::find($id)->delete();
        return ['status'=>0,'msg'=>'删除成功'];
    }

路由

 Route::delete('del/{id}','WeekController@del')->name('admin.del');//删除

在这里插入图片描述

ajax 批量删除

视图层:

	<input type="checkbox" value="{{$v->id}}" name="id[]">

	<script>
		  //全选删除 点击事件
    function datadel(){
        //询问框
        layer.confirm('确定要删除吗？', {
            btn: ['确认删除','取消'] //按钮
        },()=>{
            let ids=$('input[name="id[]"]:checked');
            let id = [];
            //循环
            $.each(ids,(k,v)=>{
                id.push($(v).val());
            });
            if(id.length >0 ){
                //发起ajax
                $.ajax({
                    url:"{{route('admin.dell')}}",
                    data:{id,_token},
                    type:'DELETE',
                }).then(ret=>{
                    if(ret.status ==0){
                        layer.msg(ret.msg,{time:2000,icon:1},()=>{
                            location.reload();
                        })
                    }
                })
            }
        });
    }
	</script>

控制器:

 //全选删除
    public function dell(Request $request){

      $id = $request->get('id');    //接收删除的id
      Users::destroy($id);

      return ['status'=>0,'msg'=>'全选删除成功'];
    }

Excel导出功能

 header("content-type:text/html;charset=utf-8");
 $dataa = DB::table('users')->get();
$data = json_decode(json_encode($dataa),true);


 $str="编号\t权限\账号\t姓名\t密码\t邮箱\t电话\性别\ip\建立时间\修改时间\删除时间"."\n";
 foreach($data as $key=>$v){
     $str.=implode("\t",$v)."\n";
 }

 header("content-type:application/vnd.ms-excel");
 header("content-disposition:attachment;filename=users.xls");
 echo $str;

饼状图

官方文档:https://www.highcharts.com.cn/demo/highcharts.

public function FanDiagram()
{
    $data = Users::select('sex')->get();
    $res = json_decode(json_encode($data),true);

    foreach ($res as $k=>$v){
        if($v['sex'] == '女士'){
            $woman[][] = $v;
        }else{
            $man[][] = $v;
        }
    }
    $a['woman'] = count($woman);
    $a['man'] = count($man);

    return view('user.FanDiagram',['data'=>$a]);
}