Summernote WYSIWYG editor not rendering data correctly with Laravel 5.8 - laravel

I have a problem when I want to rendering data and Images from database, I'm using Summernote and Laravel, I will paste my Code of the controller and views, thanks in advance.
I get summer note show correctly with all his options, but when I try to add some things in my text like make it bold or something like that he did not work.
Controller:
public function createPost(Request $request){
$this->validate($request, [
'title' => 'required',
'description' => 'required',
]);
$title = $request->input('title');
$description = $request->input('description');
$writer = Auth::user()->id;
$dom = new \DomDocument();
$dom->loadHtml($description, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
$images = $dom->getElementsByTagName('img');
foreach($images as $k => $img){
$data = $img->getAttribute('src');
list($type, $data) = explode(';', $data);
list(, $data) = explode(',', $data);
$data = base64_decode($data);
$image_name= "/upload/" . time().$k.'.png';
$path = public_path() . $image_name;
file_put_contents($path, $data);
$img->removeAttribute('src');
$img->setAttribute('src', $image_name);
}
$description = $dom->saveHTML();
$post = new Post;
$post->title= $title;
$post->description = $description;
$post->writer = $writer;
$post->save();
return redirect()->route('home')->with('success', 'Post has been successfully added!');
}
Add view:
#if(Auth::check())
<div class="col-md-12">
<form method="post" action="{{ route('post.form') }}">
{{ csrf_field() }}
<div class="form-group">
<label for="name">Title</label>
<input type="text" class="form-control" id="id_title" name="title"
aria-describedby="title" placeholder="Enter title">
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea class="form-control" id="content" rows="3" name="description" placeholder="Description"></textarea>
</div>
<button type="submit" class="btn btn-primary">Publish <i class="fas fa-paper-plane"></i></button>
</form>
</div>
#endif
Call of the summernote:
<script>
$(document).ready(function() {
$('#content').summernote({
height:300,
});
});
</script>
Example of the result, title plus content :

You should use {!! $description !!} to print as html.

Inspect the output in the browser, maybe the summernote plugin is not called properly,
In head tag, check the javascript plugin, and the css as well. Put them is proper order.

Related

Call to a member function getClientOriginalExtension() on null what should do?

public function store(Request $request)
{
$data = new product1();
$file = $request->file;
$filename= time().'.'.$file->getClientOriginalExtension();
$request->file->move('assets', $filename);
$data->file = $filename;
$data->name = $request->name;
$data->description = $request->description;
$data->author = $request->author;
$data->comment = $request->comment;
$data->save();
return redirect()->back();
}
View:
<form action="{{ url('uploadproduct') }}" method="post" enctype="multipart/form-data">
#csrf
<div class="form-group">
<input class="form-control" name="comment" placeholder="Write comment" type="text" style=" width: 50%;">
<input class="btn btn-primary" type="submit" value="Done" style=" width: 20%;">
</div>
</form>
$file is null when trying to get its properties.
You can either condition the process to the existence of $file (in case that the 'file' input is not required), or simply check what is happening that input value is null when requesting it.
Maybe there's no <input type="file" name="file"> in your form...
Or maybe your form has no enctype="multipart/form-data" property that allows you to submit files.
I DO also recommend you to validate your request before processing the data: https://laravel.com/docs/8.x/validation
public function store(Request $request)
{
$validator = Validator::make($request->all(), [
'file' => 'required'
]);
if ($validator->fails()) {
return Redirect::back()->withErrors($validator)->withInput();
}
// Here you start processing your inputs
}

Laravel - search submit is not redirecting to the next blade

In my Laravel-5.8, I am using the index as the search page:
public function index()
{
$search = '';
if (request('search'))
{
$search = request('search');
return redirect()->route('client', [$search]);
}
return view('index', ['search' => $search]);
}
public function client($clientid)
{
$myparam = $clientid;
$client = new Client();
$res = $client->request('GET','https://example/{$myparam}', [
'query' => ['key' => 'jkkffd091']
])->getBody();
$geoLocation = json_decode($res->getContents(), true);
return view('client', [
'geoLocation' => $geoLocation
]);
}
Here is my index blade:
<form method="GET" action="{{ route('index', ['search' => $search]) }}">
<div class="field">
<label class="label blog-sidebar-label" for="search">
<input class="search-field" type="search" name="search" id="search" placeholder="client id..." value="{{ $search }}">
</label>
</div>
</form>
I have this route:
Route::get('/', [HomeController::class, 'index'])->name('index');
Route::get('client/{search}', [HomeController::class, 'client'])->name('client');
What I want to achieve is that when the search button for index is submitted with the clientid in the text input field, it should take the clientid as parameter and pass it to client controller. Also redirect to client blade.Then when nothing is in the text input field, it should indicate.
But it is not redirecting. How do I achieve this?
Thanks
Probably you want to submit without a submit button. Then you can submit with JS :
<form id="submitForm" method="GET" action="{{ route('index', ['search' => $search]) }}">
<div class="field">
<label class="label blog-sidebar-label" for="search">
<input class="search-field" type="search" name="search" id="search" placeholder="client id..." value="{{ $search }}">
</label>
</div>
</form>
<!-- JS code below -->
<script>
document.getElementById("search").onchange = function() {myFunction()};
function myFunction() {
document.getElementById("submitForm").submit();
}
</script>

Image saving as tmp in database in Laravel 8

Blade File
<form action="{{route('sproduct.store')}}" method="post" enctype="multipart/form-data"
class="w-75 mx-auto mt-5 mb-5">
#csrf
<div class="form-group mt-2 mb-2">
<label for="formgroupexampleinput">Select Product</label>
<select name="products" id="products">
<option>Select Product</option>
#foreach ($products as $product)
<option value="{{$product->id}}">{{$product->title}}</option>
#endforeach
</select>
</div>
<div class="form-group mt-3 mb-3">
<label for="formgroupexampleinput">Display Images</label>
<input type="file" name="file[]" multiple>
</div>
<input type="submit" class="form-control btn-primary w-25" value="Submit">
</form>
Fuction
public function store(Request $request)
{
if ($request->hasfile('file')) {
foreach ($request->file as $file) {
$fileExt = $file->getClientOriginalExtension();
$image_name = "img_".rand(123456,999999). "." .$fileExt;
$destination_path = public_path('/uploads/products_images/display_images');
$file->move($destination_path, $image_name);
$image = new Image();
$image->image = $file;
$image->product_id = $request->products;
$image->save();
}
return "done";
}
}
Question
hi, I am trying to add images to my images table but the image is saving as a tmp file in the database but saving as a jpg in the given folder. I don't know the solution to this. Please let me know why this is happening and how to fix it.
Thankyou in Advance.
mikenenter code here in comment told me I needed to save the name of the file.
public function store(Request $request)
{
if ($request->hasfile('file')){
foreach ($request->file as $file) {
$fileExt = $file->getClientOriginalExtension();
$image_name = "img_".rand(123456,999999). "." .$fileExt;
$destination_path = public_path('/uploads/products_images/display_images');
$file->move($destination_path, $image_name);
$image = new Image();
$image->image = $image_name;
$image->product_id = $request->products;
$image->save();
}
return "done";
}
}

Laravel Image Upload not saving to public folder

I am struggling with this image upload system.
It is supposed to upload an image that will be attached to a post (each post has 1 image).
Everything seems to be working fine, the problem is that when I check the database for the image path, I see a path to a random temporary file and the image doesn't even get uploaded to the right folder inside the app public folder.
Check the logic below:
PostController.php
public function store(Request $request)
{
$post = new Post;
$request->validate([
'title' => 'required',
'description' => 'required',
'slug' => 'required',
'message' => 'required',
'user' => 'required',
'post_image' => 'image|mimes:jpeg,png,jpg,gif|max:2048'
]);
if ($request->has('post_image')) {
$image = $request->file('post_image');
$name = Str::slug($request->input('title')).'_'.time();
$folder = '/uploads/images/';
$filePath = $folder . $name. '.' . $image->getClientOriginalExtension();
$this->uploadOne($image, $folder, 'public', $name);
$post->post_image = Storage::url($filePath);;
}
Post::create($request->all());
return \Redirect::to('admin')->with('success','Great! Post created successfully.');
}
UploadTrait.php
trait UploadTrait
{
public function uploadOne(UploadedFile $uploadedFile, $folder = null, $disk = 'public', $filename = null)
{
$name = !is_null($filename) ? $filename : Str::random(25);
$file = $uploadedFile->storeAs($folder, $name.'.'.$uploadedFile->getClientOriginalExtension(), $disk);
return $file;
}
}
Post.php (model)
class Post extends Model
{
protected $fillable = [
'title',
'description',
'slug',
'message',
'user',
'post_image'
];
public function getImageAttribute(){
return $this->post_image;
}
}
Create.blade.php
<form action="{{ route('blog.store') }}" method="POST" name="add_post" role="form" enctype="multipart/form-data">
{{ csrf_field() }}
<h1>New Post</h1>
<div role="separator" class="dropdown-divider"></div>
<div class="form-row">
<div class="form-group col-12 col-md-6">
<label for="title">Post Title</label>
<input type="text" autocomplete="off" class="form-control" id="title" name="title" placeholder="Your post title" required>
<span class="text-danger">{{ $errors->first('title') }}</span>
</div>
<div class="form-group col-12 col-md-6">
<label for="slug">Slug</label>
<input type="text" autocomplete="off" class="form-control" id="slug" name="slug" placeholder="Write post slug" required>
<span class="text-danger">{{ $errors->first('slug') }}</span>
</div>
</div>
<div class="form-row">
<div class="form-group col-12 col-md-12">
<label for="description">Post Description</label>
<textarea class="form-control" id="description" name="description" placeholder="Enter a small description for your post" required></textarea>
<span class="text-danger">{{ $errors->first('description') }}</span>
</div>
</div>
<div class="badge badge-warning badge-pill">Message</div>
<div role="separator" class="dropdown-divider"></div>
<div class="form-row">
<div class="form-group col-md-12">
<textarea class="form-control" col="4" id="message" name="message"></textarea>
<span class="text-danger">{{ $errors->first('message') }}</span>
</div>
</div>
<input type="hidden" value="{{ Auth::user()->name }}" name="user">
<input id="post_image" type="file" class="form-control" name="post_image">
<button type="submit" class="btn btn-warning btn-block">Create Post</button>
</form>
Thank you for your help!
Regards,
Tiago
You can use directly the functions provided by Laravel itself
$image_path = Storage::disk('public')->putFile('folders/inside/public', $request->file('post_image'));
Notice Storage::disk('public') that specifies the public folder.
Then you can update your request array with $request['image_path'] = $image_path and save it like you're currently doing or you cant still use your $post = new Post; and set every input data like $post->title = $request->title; then save like $post->save();
You did not save the image path in the database on the created post
$post = new Post; //here you have created an empty Post object
...
$post->post_image = Storage::url($filePath); //here you assigned the post_image to the empty object.
Post::create($request->all());// here you create a new POST object with the request data, which does not contain the post_image
Thank you David! I managed to correct the path that gets saved to the database, but the files are not getting uploaded (even though the path in database says /uploads/images/something.png, when i check the folder, the image is not there.. there is not even an uploads folder. This is the method I have now with your suggestions:
public function store(Request $request)
{
$request->validate([
'title' => 'required',
'description' => 'required',
'slug' => 'required',
'message' => 'required',
'user' => 'required',
'post_image' => 'image|mimes:jpeg,png,jpg,gif|max:2048'
]);
if ($request->has('post_image')) {
$image = $request->file('post_image');
$name = Str::slug($request->input('title')).'_'.time();
$folder = '/uploads/images';
$filePath = $folder . $name. '.' . $image->getClientOriginalExtension();
$this->uploadOne($image, $folder, 'public', $name);
$image_path = Storage::disk('public')->putFile('uploads/images', $request->file('post_image'));
$request['image_path'] = $image_path;
}
$post = new Post;
$post->title = $request->title;
$post->description = $request->description;
$post->slug = $request->slug;
$post->message = $request->message;
$post->user = $request->user;
$post->post_image = $request->image_path;
$post->save();
return \Redirect::to('admin')->with('success','Great! Post created successfully.');
}
Input in form
<form method="POST" enctype="multipart/form-data" action="/url">
<input id="category_logo" type="file" class="form-control" name="category_logo">...
Code in controller
$category = Category::find($id);
if($request->has('category_logo')) {
$image = $request->file('category_logo');
$category->category_logo = $image->getClientOriginalName();
$image->move(public_path('img/logo'), $image->getClientOriginalName());
}
$category->save();
Works for me!

File uploader gives null when i want to sent it to my database

I was trying to make a file uploader in laravel. But when i want to send it to database it have a null value when i send it to the controller. I don't know where I have to go to with this problem to fix it.
My view:
<div class="container">
<form method="POST" action="/admin/add-album/add">
#csrf
<label>Album name</label>
<input type="text" name="album_name" class="form-control">
<br>
<input id="file-upload" type="file" name="album_picture" accept="image/*">
<br>
<input type="submit" name="submit" class="form-control">
</form>
</div>
My controller:
public function addAlbumDatabase(Request $request)
{
request()->validate([
'album_name' => ['required'],
]);
$slug = $this->slugify(request('album_name'));
$user = \Auth::user();
dd($request->file('album_picture'));
if ($files = $request->album_picture) {
$destinationPath = 'public/images/';
$profileImage = date('YmdHis') . "." . $files->getClientOriginalExtension();
$files->move($destinationPath, $profileImage);
} else {
dd("mislukt om de image up te loaden");
}
Albums::create([
'user_id' => $user->id,
'album_name' => request('album_name'),
'album_profile_picture' => $profileImage,
'album_slug'=> $slug
]);
return redirect('admin/add-album');
}
my model:
class Albums extends Model {
protected $fillable = [
'user_id', 'album_name', 'album_profile_picture', 'album_slug'
];
}
Add enctype="multipart/form-data" in your form rule. So:
<form method="POST" action="/admin/add-album/add" enctype="multipart/form-data">

Resources