# 第4节 Laravel-通过表单实现新增及操作状态提示功能 #
4.1 显示新增表单视图
4.2 通过模型实现新增
4.3 操作状态提示
## 4.1 显示新增表单视图 ##
修改边栏的链接
`\resources\views\shared\siderbar.blade.php`
~~~
<div class="col-md-3">
<div class="list-group">
<a href="{{ url('/') }}" class="list-group-item active">学生列表</a>
<a href="{{ url('student/create') }}" class="list-group-item">新增学生</a>
</div>
</div>
~~~
`\resources\views\shared\message.blade.php`
~~~
<div class="alert alert-danger">
<ul>
<li>姓名不能为空</li>
<li>年龄只能为整数</li>
<li>请选择性别</li>
</ul>
</div>
~~~
`\resources\views\student\create.blade.php`
~~~
@extends('layout/student')
@section('content')
<!-- 所有的错误提示 -->
@include('shared/message')
<!-- 自定义内容区域 -->
<div class="panel panel-default">
<div class="panel-heading">新增学生</div>
<div class="panel-body">
<form class="form-horizontal">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">姓名</label>
<div class="col-sm-5">
<input type="text" class="form-control" id="name" placeholder="请输入学生姓名">
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">姓名不能为空</p>
</div>
</div>
<div class="form-group">
<label for="age" class="col-sm-2 control-label">年龄</label>
<div class="col-sm-5">
<input type="text" class="form-control" id="age" placeholder="请输入学生年龄">
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">年龄只能为整数</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">性别</label>
<div class="col-sm-5">
<label class="radio-inline">
<input type="radio" name="sex" value="option1"> 未知
</label>
<label class="radio-inline">
<input type="radio" name="sex" value="option2"> 男
</label>
<label class="radio-inline">
<input type="radio" name="sex" value="option3"> 女
</label>
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">请选择性别</p>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary">提交</button>
</div>
</div>
</form>
</div>
</div>
@endsection
~~~
`\app\Http\Controllers\StudentController.php`
~~~
/**
* 新增表单页面,表单提交到当前页
*
* @param
* @return void
* @author webjust [604854119@qq.com]
*/
public function create()
{
return view('student/create');
}
~~~
`\app\Http\routes.php`
~~~
Route::get('/', ['uses' => 'StudentController@index']);
// 新增表单路由
Route::any('student/create', ['uses' => 'StudentController@create']);
~~~
添加hover效果。`\resources\views\shared\siderbar.blade.php`
~~~
<div class="col-md-3">
<div class="list-group">
<a href="{{ url('/') }}"
class="list-group-item {{ Request::path() == '/' ? 'active' : '' }}">学生列表</a>
<a href="{{ url('student/create') }}"
class="list-group-item {{ Request::path() == 'student/create' ? 'active' : '' }}">新增学生</a>
</div>
</div>
~~~
这里使用了 `Request::path()` 方法,更多Request facade 方法可以查看手册:<https://cs.laravel-china.org/#requests>
![](https://box.kancloud.cn/5a1b3ef6665bd8613e8f7aacb6832936_1046x728.png)
## 4.2 通过模型实现新增 ##
给form表单添加action:
<form class="form-horizontal" method="post" action="{{ url('student/create') }}">
\app\Http\Controllers\StudentController.php
public function create(Request $request)
{
// 判断是POST请求,也就是提交表单时走这个区间
if($request->isMethod('POST'))
{
echo "post";
}
return view('student/create');
}
此时会报 TokenMismatchException in VerifyCsrfToken.php line 67: 的错误。
<blockquote class="info">
Laravel 提供简单的方法保护你的应用程序不受到 跨网站请求伪造 攻击。跨网站请求伪造是一种恶意的攻击,破坏份子伪造 已通过身份检验的用户身份 来运行未经授权的命令。
Laravel 会自动生成一个 CSRF token 给每个用户的 Session。该 token 用来验证用户是否为实际发出请求的用户。可以使用 csrf_field 辅助函数来生成一个包含 CSRF token 的 _token 隐藏表单字段。
</blockquote>
> 更多查看:<http://d.laravel-china.org/docs/5.2/routing#csrf-protection>
在Blade模板引擎中使用:
{{ csrf_field() }}
修改 `input` 字段的属性:`name="Student[name]"` 这样可以获得一个数组下标以模型名命名的数组。
`\resources\views\student\create.blade.php`
~~~
<form class="form-horizontal" method="post" action="{{ url('student/create') }}">
{{ csrf_field() }}
<div class="form-group">
<label for="name" class="col-sm-2 control-label">姓名</label>
<div class="col-sm-5">
<input type="text" name="Student[name]" class="form-control" id="name" placeholder="请输入学生姓名">
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">姓名不能为空</p>
</div>
</div>
<div class="form-group">
<label for="age" class="col-sm-2 control-label">年龄</label>
<div class="col-sm-5">
<input type="text" name="Student[age]" class="form-control" id="age" placeholder="请输入学生年龄">
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">年龄只能为整数</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">性别</label>
<div class="col-sm-5">
<label class="radio-inline">
<input type="radio" name="Student[sex]" value="2"> 未知
</label>
<label class="radio-inline">
<input type="radio" name="Student[sex]" value="1"> 男
</label>
<label class="radio-inline">
<input type="radio" name="Student[sex]" value="0"> 女
</label>
</div>
<div class="col-sm-5">
<p class="form-control-static text-danger">请选择性别</p>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary">提交</button>
</div>
</div>
</form>
~~~
修改:`\app\Http\Controllers\StudentController.php`
public function create(Request $request)
{
// 判断是POST请求,也就是提交表单时走这个区间
if($request->isMethod('POST'))
{
$data = $request->input('Student');
var_dump($data);
}
return view('student/create');
}
访问:`http://example.com/student/create` 提交表单,效果:
![](https://box.kancloud.cn/920a4bae7ca74cf8bf876cebaa0d8a68_1046x728.png)
实现模型的添加操作:
// 判断是POST请求,也就是提交表单时走这个区间
if($request->isMethod('POST'))
{
$data = $request->input('Student');
// var_dump($data);
$data['created_time'] = time();
$data['updated_time'] = time();
// 模型的添加方法
$ret = Student::insert($data);
var_dump($ret);
}
添加数据测试,查询数据库,可以看到新增加了1条记录哦!(*^__^*) 嘻嘻……
![](https://box.kancloud.cn/5851cbc96922b10d695b0ad47f50b908_677x666.png)
**使用重定向方法:`redirect()`**
~~~
public function create(Request $request)
{
// 判断是POST请求,也就是提交表单时走这个区间
if($request->isMethod('POST'))
{
$data = $request->input('Student');
// var_dump($data);
$data['created_time'] = time();
$data['updated_time'] = time();
// 模型的添加方法
$ret = Student::insert($data);
if($ret)
{
return redirect('/');
} else{
return redirect('student/create');
}
}
return view('student/create');
}
~~~
## 4.3 操作状态提示 ##
***重定向并加上 Session 闪存数据***
通常重定向至新的 URL 时会一并 写入闪存数据至 session。所以为了方便,你可以利用链式调用的方式创建一个 RedirectResponse 的实例 并 闪存数据至 Session。这对于在一个动作之后保存状态消息相当方便:
return redirect('/')->with('success', '操作成功!');
当然,在用户重定向至新的页面后,你可以获取并显示 session 的闪存数据。举个例子,使用 Blade 的语法:
@if (session('success'))
<div class="alert alert-success">
{{ session('success') }}
</div>
@endif
修改如下:
// 模型的添加方法
$ret = Student::insert($data);
if($ret)
{
return redirect('/')->with('success', '添加成功!');
} else{
return redirect('student/create')->with('error', '添加失败!');
}
`\resources\views\shared\success.blade.php`
~~~
@if(Session::has('success'))
<!-- 成功提示框 -->
<div class="alert alert-success alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<strong>成功!</strong> {{Session::get('success')}}
</div>
@endif
@if(Session::has('error'))
<!-- 失败提示框 -->
<div class="alert alert-danger alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<strong>失败!</strong> {{Session::get('error')}}
</div>
@endif
~~~
同理,我们也可以使用 Session类的方法。如:
@if(Session::has('success'))
{{Session::get('success')}}
为了显示最新添加的数据,我们采用倒序的排列方式:
public function index()
{
// 对 Eloquent 模型进行分页
$students = Student::orderby('id', 'desc')->paginate(5);
// 渲染 student/index 视图,并传递查询出来的全部数据
return view('student/index', ['students' => $students]);
}
**最终效果如下:**
![](https://box.kancloud.cn/ee42b1f39ed91771e6a93ccde4a6c535_1046x728.png)