Part 9 - Adding UPLOAD PHOTO/PICTURE of/for products
Topic: LARAVEL PROJECT (E-SHOP) CAPSTONE PROJECT
Part 9 - Adding UPLOAD PHOTO/PICTURE of/for products
1 - in this tutorial we will add a picture for our products
using upload form file
lets start..
first we need to run our application
currently we dont have a picture, lets add a default picture for our products if we dont have a picture uploaded yet..
add a folder default_images inside public folder
add an image default_products.png
NOTE: any default picture will do
2 - lets add link to the image, when clicked it will load the upload form for the file of the image to be uploaded
looks like this
a href=""
img src="{{asset('default_images/default_product.png')}}" title="upload photo" class="img-fluid img-thumbnail" alt="product image"
/a
3- lets create a separate controller for this process
run php artisan make:controller /seller/ProdPicCtrl -r
4- create a route for the controller for the edit function
go to routes - web.php
add the line: Route::resource('propics','ProdPicCtrl');
should look like this
Route::namespace('App\Http\Controllers\seller')- prefix('seller')- name('seller.')- middleware('can:seller-access')- group(function(){
Route::resource('products','prodsCtrl');
Route::resource('propics','ProdPicCtrl'); // line added
});
run php artisan route:list
to check route
copy seller.propics.edit and add as route to the link for the upload photo
should look like this:
a href="{{route('seller.propics.edit',$prod- id)}}"
img src="{{asset('default_images/default_product.png')}}" title="upload photo" class="img-fluid img-thumbnail" alt="product image"
/a
5 - lets create a table where the filename of the pictures will be saved ...
create a model "ProdPics"
edit model, goto database - migrations
should look like
Schema::create('prod_pics', function (Blueprint $table) {
$table- id();
$table- integer('prod_id');
$table- string('picfilename');
$table- timestamps();
});
run php artisan migrate
6 - lets adda a form for the upload photo and redirect the user there using /from the controller edit function
goto the controller look for the edit function and add
the ff:
$prod = products::find($id);
return view('seller.products.prodpics.edit')
with('prod',$prod);
go to resources - views - products folder
add a folder prodpics
copy the index.blade
paste it insde the prodpics folder
remove the foreach
7 - lets add the form for the upload image file
goto the image element and add the the form
form enctype="multipart/form-data" action="{{route('seller.propics.update',$prod- id)}}" method="post"
@csrf
@method('PUT')
label for="" Image File /label
div class="form-group"
input type="file" name="img" id="" required
/div
input type="submit" value="Save" class="btn btn-danger"
/form
8 - go back to the controller and add the code for the image upload and to save the filename of the image to the database table
look for the function update, this will upload the file to the system location/destination of storage inside public folder
the specified folder is the user id
add the ff code:
$img = $request- file('img');
$dest = "storage/".Auth::user()- id;
$pfix = "prodpic_";
$imgext = $img- getClientOriginalExtension();
$imgfilename = $img- storeAs('/',$pfix.$request- user()- id."-".date('Yms').".".$imgext);
$img- move($dest,$imgfilename);
run php artisan storage:link
let me adda a new seller account to test
9 add the code to insert the filename of the image inside the database table
add the code:
$savepic = new ProdPics;
$savepic- prod_id = Auth::user()- id;
$savepic- picfilename = $imgfilename;
$savepic- save();
return redirect('/seller/products');
lets test if the image filename will be recorded on the database
lets fix this issue, currently I am seeing other products created by other sellers lets make it secured.
goto the controller where the function index is
chage the code $p = products::all();
to
$p = products::where('sellerid',Auth::user()- id)
get();
to make it specific to the user currently logged in
10 lets display the image to the view products blade
go back to the resources -views
Watch video Part 9 - Adding UPLOAD PHOTO/PICTURE of/for products online without registration, duration hours minute second in high quality. This video was added by user Leo Paliuanan 05 April 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 147 once and liked it 5 people.