Tìm hiểu route + truyền dữ liệu từ controller tới view qua bài quản lý sản phẩm - Lập trình Laravel

Viết các chức năng của chương trình quản lý sản phẩm.

Chú ý : base_url là đường dẫn tới thư mục public của laravel (ví dụ : https://107.0.0.1:8000)

Yêu cầu như sau.

1. Tạo 1 file route đặt tên là computer.php. Cấu hình để hệ thống nhận diện route đó

2. Tạo các route lần lượt như sau

2.1 Khi người dùng truy cập với đường dẫn base_url/product/view -> gọi tới view cho phép nhập thông tin tên sản phẩm, hình ảnh, giá, giảm giá, mô tả. (view này được trả về trực tiếp từ route computer.php). View này có hiển thị button cho phép add thông tin sản phẩm
2.2 Khi người dùng click vào button add sản phẩm trong mục trên -> gọi route post đặt tên là product/add. Route này sẽ gọi tới 1 controller đặt tên là ProductController. Chức năng này sẽ hiển thị tất cả thông tin đã nhập ra màn hình. Giao diện tuỳ ý.
2.3 Sửa lại ý 2.2 -> Nếu thông tin sản phẩm nhập vào hợp lệ (tên khác rỗng, hình ảnh khác rỗng) -> thực hiện redirect về trang base_url/product/view

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)

Trương Công Vinh

2020-06-25 09:16:34

ProductController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ProductController extends Controller
{
    public $productList = [];
    //
    function addproduct(Request $request){
          
        $productList[]=[
            'name' => $request->proname,
            'img'  => $request->url,
            'price'  => $request->price,
            'discount'  => $request->discount,
            'description'  => $request->description
        ];
           

            return view('viewProduct')->with([
                'productList' => $productList
            ]);
           
    }
    
}



?>

computer.php

<?php

use Illuminate\Support\Facades\Route;


Route::group(['prefix'=>'/product'],function(){
    Route::get('/view',function(){
        return view('inputProduct');
    })->name('input');
    Route::post('/add','ProductController@addproduct');
    
});

viewProduct.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
           
  <table class="table table-hover">
    <thead>
      <tr>
        <th>Name's Product</th>
        <th style="height: auto,with:auto">Image</th>
        <th>Price</th>
        <th>Discount(%)</th>
        <th>Décription</th>
      </tr>
    </thead>
    <tbody>
      @foreach ($productList as $product)
      <tr>
        <td>{{$product['name']}}</td>
        <td> <img style="height: 50%,with:50%" src="{{$product['img']}}" alt=""> </td>
        <td>{{$product['price']}}</td>
        <td>{{$product['discount']}}%</td>
        <td>{{$product['description']}}</td>
      </tr>
      @endforeach
    </tbody>
  </table>
  <a href="view" class="btn btn-success"> Input </a>

</div>

</body>
</html>

inputProduct.blade.php

<!DOCTYPE html>
<html lang="vi">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Product</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i">
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

	</head>
	<body>
		<div id="wallpaper">
			
			<div class="container">
				<div class="panel panel-primary">
					<div class="panel-heading">
						<h2 class="text-center"> Input Product's Detail Information</h2>
					</div>
					<div class="panel-body">
					<form class="" action="add" method="post">
							{{ csrf_field() }}
							<div class="form-group">
								<label for="usr">Name of product : </label>
								<input required="true" type="text" name="proname" class="form-control" id="usr">
							</div>
							 <div class="form-group">
								<label for="image">Url image :</label>
								<input required="true" type="text" name="url" class="form-control" id="image">
							</div>
							 <div class="form-group">
								<label for="usr">Price:</label>
								<input required="true" type="text" name="price" class="form-control" id="price">
							</div>
							<div class="form-group">
								<label for="discount">Installment :</label>
								<input required="true" type="text" name="discount" class="form-control" id="installment" placeholder="%">
							</div>
							<br>
							<div class="input-group">
							  <span class="input-group-addon">Description</span>
							  <input id="msg" type="text" name="description" class="form-control" name="msg" placeholder="Additional Info">
							</div>


							 <br>
							 <br>

							<button class="btn btn-success" type="submit">Add</button>
						</div>
						</form>
				</div>
			</div>
			</div>
			
		</div>
		
	</body>
</html>

thienphu

2020-06-25 08:02:33

#showProduct.blade.php

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="panel panel-primary">
			<div class="panel-heading" style="margin-bottom: 50px;margin-top: 20px;">
				<h1><center>Manage Information Product</center></h1>

			</div>
			<div class="panel-body">
				<table class="table table-bordered">
					<thead>
						<tr>
							<th>STT</th>
							<th>NameProduct</th>
							<th>Price</th>
							<th>Discount</th>
							<th>Description</th>

						</tr>
					</thead>
					<tbody>
						<td>1</td>
						<td>{{$nameproduct}}</td>
						<td>{{$price}}</td>

						<td>{{$discount}}</td>

						<td>{{$description}}</td>

					</tbody>
				</table>
					<a href="/product/view">Go to Input Product</a>
			</div>
		</div>
	</div>
</body>
</html>

#viewComputer.blade.php


<!DOCTYPE html>

<html>
<head>
	<title></title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<h1><center>Infomation Product</center></h1>
	<div class="container">

		<form action="/product/add" method="GET" >

			<div class="form-group">
				<label for="nameproduct">Name Product</label>
				<input type="text" class="form-control" name="nameproduct" id="nameproduct">
			</div>

			<div class="form-group">
				<label for="price">Price</label>
				<input type="text" class="form-control" name="price" id="price">
			</div>
			<div class="form-group">
				<label for="discount">Discount</label>
				<input type="text" class="form-control" name="discount" id="discount">
			</div>
			<div class="form-group">
				<label for="pwd">Description:</label>
				<input type="text" class="form-control" name="Description" id="Description">
			</div>




			<button  type="submit" id="insertData" class="btn btn-success">Add Products</button>
		</form>

	</div>



</body>
</html>

#data.php

<?php

use Illuminate\Support\Facades\Route;

Route::group(['prefix' => '/product'], function () {
	Route::get('/view', 'ControllerProduct@conectViewComputer');

	Route::get('/add', 'ControllerProduct@receive_data');

});

#ControllerProduct.php

<?php

namespace App\Http\Controllers;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;

class ControllerProduct extends Controller {
	public function conectViewComputer(Request $request) {
		return view('viewProduct.viewComputer');
	}
	public function receive_data(Request $request) {
		//var_dump($request->all());
		$nameproduct = $request->nameproduct;
		$price = $request->price;
		$discount = $request->discount;
		$description = $request->Description;
		if ($nameproduct != '') {
			return view('viewProduct.showProduct')->with([
				'nameproduct' => $nameproduct,
				'price' => $price,
				'discount' => $discount,
				'description' => $description,
			]);
		} else {
			return view('viewProduct.viewComputer');
		}
		//echo $nameproduct . $price . $discount . $description;

	}

}