laravel文件上传,视图添加内容到数据库,视图分页显示数据库的内容


一,文件上传到数据库:


继续上次的项目进行编写,项目地址:laravel自动验证项目地址

https://blog.csdn.net/qq_45844648/article/details/105536922

当做一个http请求来看待。

(1),首先要修改表的结构,给member表添加一个字段,字段名为avataravatar
(2)创建添加数据的表单和路由,这里继续使用前面项目的路由,也就是下面这些代码:

控制器里的代码;

//用来自动验证
public function testbiaodan(Request $request){
 $this->validate($request,[
        'id' => 'required|min:2|max:6',
        'name' => 'required|min:2|max:255',
        'age' => 'required|integer|min:0|max:100',
        'email' => 'required|email'
    ]);
    // 处理文件上传的操作
    if($request->hasFile('avatar')&&$request->file('avatar')->isvalid()){
        // 对上传的文件进行必要处理
        $filename=date('ymdHis').rand(100000,999999).'.'.$request->file('avatar')->extension();
        // 移动文件到指定目录下
        $request->file('avatar')->move('./statics/upload',$filename);
    }
    // 验证成功后提示信息
    echo '验证成功';
}

创建路由;(验证信息发送到的位置的提交方式必须为post)

Route::get('biaodan','TestController@biaodan');
Route::post('testbiaodan','TestController@testbiaodan')->name('tb');

用户交互页面,也就是biaodan.php(就是对应创建路由的第一个参数)

  • 必须要添加enctype="multipart/form-data"
  • 提交方式必须为post
  • 至少有一个input类型为file
  <form action="{{route('tb')}}" method="post" enctype="multipart/form-data">
       <input type="text" name="id" placeholder="学号"/>
       <br />
       <input type="text" name="name" placeholder="姓名"/>
       <br />
       <input type="text" name="age" placeholder="年龄"/>
       <br />
       <input type="text" name="email" placeholder="邮箱"/>
       <br />
       头像
       <br />
       <input type="file" name="avatar"/>
       <br />
       <!-- 下面两种方式都可使用 -->
       <!-- <input type="hidden" name="_token" value="{{csrf_token()}}"/> -->
       {{csrf_field()}}
       <input type="submit"/>
	  @if (count($errors) > 0)
		   @foreach ($errors->all() as $error)
			   <li>{{ $error }}</li>
		   @endforeach
	   @endif

(3),在laravel文件的目录,public目录下建立一个statics目录,在statics下再建立一个upload文件
文件上传的位置
在这里插入图片描述
(4)在表单页面进行验证,并选择文件,点击提交
在这里插入图片描述
(5),如果出现在控制器文件下写入的验证成功提示信息,则文件上传成功
此时,刚才建立的文件目录下就会有上传的文件啦,上传的文件名和路径都在控制器文件里写入
在这里插入图片描述

项目中使用.//的区别:

  • 如果一个路径是给php代码使用的时候最好使用./
  • 如果一个路径是给前端浏览器使用的时候则用/(在后端代码中./代表的是磁盘根目录,不是项目或站点根目录)

(6),把数据添加到数据表中
在控制器方法里,获取数据。
关于数据接收,可以使用input类,也可以使用request类:

  • $request->get();获取所有的
  • $request->all();获取所有的
  • $request->only(); 只需要数据表的部分参数
  • $request->except(); 删除不需要的参数
  • $request->has();判断某个参数有没有

request获取请求信息的方法。
https://blog.csdn.net/lw545034502/article/details/84523988

// 获取数据,存入数据库
//只需要id,name,age,email,这几个字段
    $data=$request->only(['id','name','age','email']);
    //获取上边传入到public/statics/upload/下的文件,上传到数据库的avatar表
    $data['avatar']='/statics/upload/'.$filename;//找到statics/upload里面的数据
    $res=Member::insert($data);//插入到数据表
    // 获取错误信息
    // $aa=$request->file('avatar')->getErrorMessage();
     if($res){
        // 验证成功后提示信息
        echo '验证成功';
    }else{
        // 验证成功后提示信息
        echo '验证失败';

    }

访问表单页面,填入要存入数据库的数据,按要求填写,提交

在这里插入图片描述
在这里插入图片描述
点开Navicat查看数据表里,刷新一下,此时数据表里就有刚才添加的数据表了
在这里插入图片描述
好了文件上传成功,下一步就是现实数据库里的内容了


二,在前端页面,显示数据表里的内容


(1),创建控制器方法。

// 数据分页,分页展示数据库里面的数据
public function fenye(){
    // 获取member表数据
    $data=Member::all();
    return view('fenye',compact('data'));
}

(2),配置路由。

Route::get('fenye','TestController@fenye');

(3),创建视图文件 fenye.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>分页显示数据</title>
        <style>

        </style>
    </head>
    <body>
       <table border="1px" rules="all" bordercolor="black"width="200px" height="250px" style="margin-bottom: 20px;">
           <thead align="center">
               <tr>
                   <th>序号</th>
                   <th>姓名</th>
                   <th>年龄</th>
                   <th>邮箱</th>
                   <th>头像</th>
                   <th>状态</th>
               </tr>
           </thead>
           <tbody align="center">
               @foreach($data as $value)
               <tr>
                   <td>{{$value->id}}</td>
                   <td>{{$value->name}}</td>
                   <td>{{$value->age}}</td>
                    <td>{{$value->email}}</td>
                   <td><img src="{{$value->avatar}}" width="80px"/></td>
                   <td>
                        @if($value->status==1)
                            正常
                        @else
                            禁用
                        @endif
                   </td>
               </tr>
               @endforeach
           </tbody>
       </table>
    </body>
</html>

(4),现在显示效果就是

数据表里的内容,
在这里插入图片描述
查询显示的内容,(原来图片显示有问题,我把数据删了,重新上传了一下新的数据,所以和上图中数据表中的数据不太一样,忽略下面分页的地方,修改的时候添加了分页)
在这里插入图片描述


三,分页,显示查出来的数据


(1)在数据方法中添加::
分页使用的是模型::::paginate(2),表示一页显示两条数据
直接限制条数就可以,

// 数据分页,分页展示数据库里面的数据
public function fenye(){
    // 获取数据
    $data=Member::paginate(2);
    return view('fenye',compact('data'));
}

(2)在视图文件里添加,{{$data->links()}}就可以实现分页查询

 <table border="1px" rules="all" bordercolor="black"width="200px" height="250px" style="margin-bottom: 20px;">
           <thead align="center">
               <tr>
                   <th>序号</th>
                   <th>姓名</th>
                   <th>年龄</th>
                   <th>邮箱</th>
                   <th>头像</th>
                   <th>状态</th>
               </tr>
           </thead>
           <tbody align="center">
               @foreach($data as $value)
               <tr>
                   <td>{{$value->id}}</td>
                   <td>{{$value->name}}</td>
                   <td>{{$value->age}}</td>
                    <td>{{$value->email}}</td>
                    <!-- ltrim($value->avatar),'.' -->
                   <td><img src="{{$value->avatar}}" width="80px"/></td>
                   <td>
                        @if($value->status==1)
                            正常
                        @else
                            禁用
                        @endif
                   </td>
               </tr>
               @endforeach
           </tbody>
           <tfoot>
               <tr>
                   <td colspan="3">{{$data->links()}}</td>
               </tr>
           </tfoot>
       </table>

(3)显示效果,可以点击下面的数字,进行分页查看
在这里插入图片描述
(4)可以吧分页选择那几个数字旁边的<>换成上一页,下一页
在laravel项目里打开命令行窗口,按住shift+鼠标右键
输入 php artisan vendor:publish --tag=laravel-pagination
把配置文件复制到\resources\views\vendor\pagination\bootstrap-4.blade
打开bootstrap-4.blade进行配置
在这里插入图片描述
把配置文件复制到\resources\views\vendor\pagination\bootstrap-4.blade
打开bootstrap-4.blade进行配置,换成上一页下一页
在这里插入图片描述
现在就成功了!!!!
在这里插入图片描述

  • 4
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值