Laravel edit dropzone - php

I saved files(images) by DropzoneJS and I can get them everywhere I like, but my problem is how to edit them. I go to my products edit page I can see my image but have no idea how to edit them such as (delete some of them or add to them)
here is my code to get them:
public function edit($id)
{
$product = Product::findOrFail($id);
$images = DB::table('images')->where('imageable_id', '=', $product->id)->get();
// rest of codes
}
and I show my images in edit page like:
#foreach($images as $test)
<img src="{{url('/')}}/images/{{$test->name}}" alt="test" width="100" height="100">
#endforeach
screenshot
UPDATE
#linktoahref way works for me if I want to delete each of images, and he suggested to make new uploader for adding images into my product on edit page, not bad idea totally but it's not what I'm exactly looking for.
What I try to achieve is to use DropZone itself to return my exist
images of each product and be able to remove or add to it.
I read many questions,articles, etc. And I get that I have to use mockFile which i have no idea about it. Would be appreciate if someone can help me to get this done.
Thanks.

For DELETE, you could add a button next to the image that would fire the destroy method of the respective controller
#foreach($images as $test)
<img src="{{ url('/') }}/images/{{ $test->name }}" alt="test" width="100" height="100">
<a href="#" class="btn btn-danger"
onclick="event.preventDefault();
document.getElementById('image-{{ $test->id }}').submit();">
DELETE
</a>
<form id="image-{{ $test->id }}"
action="{{ route('images.destroy', ['id' => $test->id]) }}"
method="POST" style="display: none;">
{{ csrf_field() }}
{{ method_field('DELETE') }}
</form>
#endforeach
and handle the deletion of image in your ImageController's destroy method (or your custom controller's method, make sure the method types are same)
public function destroy(Image $image)
{
// Destroy the Image
Storage::delete($image->name);
// Redirect Back
return redirect()->back();
}

Related

Problem with displaying data that I want to delete with many to many relationship in Laravel

I have many to many relationship between users and products table and I set up a view (welcome.blade.php) that when I click on the product name, which is a link, it is supposed to redirect me to page where my delete form is so I can delete that particular product, but I get 404 not found page. I suspect that error is somewhere in my routes but I can't seem to find the problem. Also when I click on some product my url says project/destroy/1 which I think is good. Here is my code:
web.php:
Route::get('/home', 'HomeController#index')->name('home');
Route::post('/store', 'HomeController#store')->name('store');
Route::delete('/destroy/{$id}', 'HomeController#destroy')->name('destroy');
destroy.blade.php:
<div class="col-md-12">
<form action="destroy/{{ $product->id }}" method="POST">
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger">Delete</button>
</form>
</div>
welcome.blade.php:
#if($products)
<table class="table">
<thead>
<th>#</th>
<th>Product Name</th>
<th>Owner Of The Product</th>
<th>Created At</th>
</thead>
<tbody>
#foreach ($products as $product)
<tr>
<td>{{ $product->id }}</td>
<td>
{{ $product->files }}
</td>
<td>
#foreach ($product->users as $user) {{ $user->name }}
#endforeach
</td>
<td>{{ date('M j, Y', strtotime($product->created_at)) }}</td>
</tr>
#endforeach
</tbody>
</table>
#endif
HomeController.php:
<?php
namespace App\Http\Controllers;
use App\Product;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\DB;
class HomeController extends Controller
{
public function destroy(Product $product)
{
$product->users()->detach();
$product->delete();
return view('destroy');
}
}
You defined the following route in your file.
Route::delete('/destroy/{$id}', 'HomeController#destroy')->name('destroy');
This creates a DELETE route. DELETE routes are meant to be accessed by APIs. Links in anchor tags use GET routes. Clicking on
{{ $product->files }}
makes the router try and match GET /destroy/{$id} which is not defined, so it throws either an exception if debug is on or a 404 if not. You can see this in action by looking at the network tab of your browser's developer console.
Unless you add another GET route, you'll keep getting 404s.
Route::get('/destroy/{$id}', 'HomeController#destroy')->name('product.destroy-form');
will make the following link work.
{{ $product->files }}
Also, in the destroy method you're returning the view without passing any variables but in destroy.blade.php you seem to be using $product. Don't forget to add it!
You are nearly there, you just have a step too many.
Good call on the form and using the delete method, this is absolutely what you are supposed to do
However where you are going wrong is in using the link to go to a separate page with the form on to delete. You are better using a little javascript so the link submits a hidden form from the link.
<a onclick="document.getElementById('delete-form-{{$product->id}}').submit();}">{{ $product->files }}</a>
<form id="delete-form-{{$product->id}}" action="{{ route('destroy', ['id' => $product->id]) }}" method="POST" style="display: none;">
#csrf
#method('delete')
</form>
You can do the method you have but you need an additional route::get request to a page that loads the form and then you can submit the form on that page to delete.
I think it is because to delete a product using a new page the first thing to do is navigate to that page which you are not doing. You are instead going directly to the delete function using this
Route::delete('/destroy/{$id}', 'HomeController#destroy')->name('destroy');
You need to define a route that lets you go to that page first which u can do by creating a route like this:
Route::get('/delete/{$id}', 'HomeController#delete')->name('delete');
You should create a new function delete in the HomeController that just returns the destroy.blade.php. Something like this.
$product= Product::find($id);
return view('destroy')->with('product', $product);
where $id is the product id and Product is the model that you are using.

How to make a page accessible even user is not logged in

I have a page which is a company page in which should be accessible even the user is not logged in. I am using blade template in which is called in all other pages. My problem now is I'm having an issue with this one:
<div class="profimg fitimg">
<img src="{{ Auth::user()->photo == null ? url('assets/images/profile.png') : Auth::user()->photo }}" alt="">
</div>
It will return an error
Trying to get property 'photo' of non-object (View: /var/www/resources/views/layouts/user/mypage.blade.php)
This part of my template gets the users profile photo. In my web.php, it looks like this:
Route::prefix('/')->group(function() {
Route::get('company', function () {
return view('user.company');
});
});
And I also have this if the user is logged in.
Route::group(['middleware' => 'auth:user'], function () {
//routes for auth user
});
My problem now is, how can I make a page accessible by public even though they are not logged in? And if they are logged in, I can get their profile info in my template. I think there's some sort of solution for this one but I just can't figure it out.
It is a good practice to pass the data instead of directly accessing a class. So, if you change the route to this -
Route::prefix('/')->group(function() {
Route::get('company', function () {
$data['user'] = Auth::user();
return view('user.company', $data);
});
});
The user item of data array should have some value if the user is logged in. Then you can check if user has any data and change your html like this-
<div class="profimg fitimg">
#if($user)
<img src="{{ $user->photo }}" alt="{{ $user->name }}">
#else
<img src="{{ url('assets/images/profile.png') }}" alt="default profile image">
#endif
</div>
Firstly, inside of laravel blade, you don't need to put php tags. You should use double curly brackets instead.
If you want to completely hide the image when a user is not logged in, you can try this:
#if(Auth::check())
<img src=" {{ Auth::user()->photo ?? url('assets/images/profile.png') }} ">
#endif
If you want to show the placeholder when the user is not logged in, or if no image has been set, try this:
#if(Auth::check() && !empty(Auth::user()->photo))
<img src=" {{ Auth::user()->photo }} ">
#else
<img src="{{ url('assets/images/profile.png') }}"
#endif

How to get an image on the desired page by clicking on that image using Laravel?

I am working on the laravel 5.0. I am getting an error: "trying to get property of non-object".I want to get an image on the desired page by clicking on that particular image. There are so many images on the page, i just want after clicking on any image, it will be appear on the desired page.
here is my code:
My Routes:
Route::get('/image/big/{id}' ,[
'uses'=>'GalleryController#bigimage',
'as'=>'bigimage'
]);
My controller:
public function bigimage($id){
$images=image::findorFail($id);
return view('bigimage' , ['images'=>$images]);
}
My view from where i am calling the required Route:
#foreach($gallery->images as $image)
<li>
<a href="{{ URL('/image/big/'.$image->id) }}">
<img id="jumboimage2" src="{{ url($image->file_path) }}"></a>
</li>
<li>
<a href="{{ URL('/image/delete/'.$image->id) }}" id="margin">
<span id="margin" class="glyphicon glyphicon-remove-sign"></span></a>
</li>
#endforeach
My view where i want to get the required image:
<div class="row">
<section class="col-md-3">
#foreach($images as $image)
{{$image->id}}
#endforeach
</section>
</div>
try this one out
$image = image::findOrFail($id);
return view('bigimage' , ['image' => $image])
$images=image::findorFail($id); should be $images=image::findOrFail($id);.
findOrFail() returns a single model, i.e. one image, so I would have:
$image = image::findOrFail($id);
return view('bigimage' , ['image' => $image]);
You don't show where image:: comes from, however usually this is from a facade so is Image:: with a capital.
The view would then not have the #foreach loop as you'd only have a single image.
<div class="row">
<section class="col-md-3">
{{$image->id}}
</section>
</div>
You also need to elaborate on this to get from the id to an image but I'm assuming that's just not shown.
If you were able to give some detail about which line is causing the error this would make it easier to diagnose, as indicated by Maraboc there could be an issue with $gallery as well.

Laravel: Image not loading

I am trying to load an image in Laravel. The image is loading in a header.blade.php file. It is working fine on other pages but when it comes to localhost:8000/edit/id, It just doesn't work. I am loading Image like this:
<a href="{!! URL::to('/') !!}">
<img src="images/logo.png" />
</a>
My Route:
Route::get('edit/{id}', array('uses' => 'HomeController#edit'));
My Controller:
public function edit($id) {
$reg = Register::find($id);
$user = User::where('email', Session::get('email'))->first();
if ($reg->user_id == $user->id) {
return View::make('edit')
->with('id', $id);
} else {
return Redirect::to('dashboard')->with('wrong', 'Sorry! Something Went Wrong!');
}
}
My image directory: public/images/logo.png
It is working fine on other pages like localhost:8000/about but it doesn't work on localhost/edit/2, any help?
The problem is that when you are on your url, it is not looking for the image in the root folder of your application, but in the current location.
So when you are visiting localhost/edit/2, it is looking for the image in localhost/edit, instead of in localhost.
Try changing your code by adding a slash in the beginning of the image
<a href="{!! URL::to('/') !!}">
<img src="images/logo.png" />
</a>
to
<a href="{!! URL::to('/') !!}">
<img src="/images/logo.png" />
</a>
Additionally, you should actually try the laravel way, like this:
{{ HTML::image('images/logo.png', 'logo') }}
try
{{ HTML::image('images/logo.png', 'logo') }}
output will be like
<img src="http://your.url/images/logo.png" alt="logo">
also you can check image path using inspect element in browser
<img src="public/storage/cover_images/image_name.format" class="img-resposive">
it will load your picture otherwise check the path to image and previlages of the folders you can load image only from a public path due to security reasons

How can I concatenate to the end of a route using Laravel?

I'm using Laravel to create a project.
Is there a way to concatenate to the end of a url using {{ route('routename') }} in an <a> tag?
I created a list of thumbnail images that link to a collection of fullsize images using a foreach loop.
#foreach ($images as $image)
<a href="{{ route('images') }}"> // link to full size image collection
<img src="{{ $image->url }}">// thumbnail image
</a>
#endforeach
{{ route('image') }} is a link to a paginated page that only contains one image per page.
so the url for the first image is my.site/images?page=1, the second is my.site/images?page=2 and so on and so on.
I'm wanting to route the user to the correct page=# according to the thumbnail they click on so they don't have to start form the beginning of the fullsize images each time the click a link from the thumbnails.
Im thinking I can use a foreach loop to increment a variable by 1 and concatenate that on the end of each href to get the correct page number but I'm not sure how I can do this using Laravel?
Im wanting my resulting html to look like this
<img src="thumbnail1.jpg">
<img src="thumbnail2.jpg">
<img src="thumbnail3.jpg">
<img src="thumbnail4.jpg">
<img src="thumbnail5.jpg">
...
Does anyone know a way?
The method you found out yourself works perfectly fine, but there is a more elegant one. All parameters you pass as second argument that are no actual route parameters (like {page}) will be appended as query string.
{{ route('images', ['page' => $n]) }}
I was able to make this work by using this code
<?php $n = 1; ?>
#foreach ($images as $image)
<a href="{{ route('images') . '?page=' . $n }}"> // link to full size image collection
<img src="{{ $image->url }}">// thumbnail image
</a>
<?php $n++; ?>
#endforeach

Categories