How Can i import Code ckeditor in my laravel app? - laravel

I am making a discussion forum application in Laravel . Here I want to use Ckeditor in comment sections. When somebody comments, then the code should show like here in stackoverflow.
#if(Auth::check()!=null)
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel panel-body">
<form action="/comment" method="POST">
{{ csrf_field() }}
<input type="hidden" name="user_id" value="{{ Auth::user()->id }}">
<input type="hidden" name="post_id" value="{{ $post->id }}">
<div class="form-group">
<label for="comment">Reply</label>
<textarea name="body" class="form-control" style="size: 200px"></textarea>
</div>
<input type="submit" name="com" id="com" class="btn btn-xs btn-success pull-right">
</form>
</div>
</div>
</div>
#endif
Please give me very simple steps to use ckeditor. My master file is layout.app and this file is comment.blade.php. Please guide me where I should enter what files and scripts files.

You can use laravel CKEditor Package;
How to install:
Set up package
composer require unisharp/laravel-ckeditor
Add ServiceProvider
Edit config/app.php, add the following file to Application Service Providers section.
Unisharp\Ckeditor\ServiceProvider::class,
Publish the resources
php artisan vendor:publish --tag=ckeditor
Usage
Default way (initiate by name or id) :
<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script>
CKEDITOR.replace( 'article-ckeditor' );
</script>
Or if you want to initiate by jQuery selector :
<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script src="/vendor/unisharp/laravel-ckeditor/adapters/jquery.js"></script>
<script>
$('textarea').ckeditor();
// $('.textarea').ckeditor(); // if class is prefered.
</script>
github link for more
Example:
#if(Auth::check()!=null)
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel panel-body">
<form action="/comment" method="POST">
{{ csrf_field() }}
<input type="hidden" name="user_id" value="{{ Auth::user()->id }}">
<input type="hidden" name="post_id" value="{{ $post->id }}">
<div class="form-group">
<label for="comment">Reply</label>
<textarea id="editor1" name="body" class="form-control" style="size: 200px"></textarea>
</div>
<input type="submit" name="com" id="com" class="btn btn-xs btn-success pull-right">
</form>
</div>
</div>
</div>
#endif
<script>
$('.editor1').ckeditor(); // if class is prefered.
</script>

<script src="{{asset('vendor/unisharp/laravel-ckeditor/ckeditor.js')}}"></script>
<script src="{{asset('vendor/unisharp/laravel-ckeditor/adapters/jquery.js')}}"></script>
#section('script')
<script>
$('textarea').ckeditor();
</script>
#endsection
and i have provided editor id

Related

Method 'POST' error 419 on local server Laravel

When i submit a post form on my page it doesn't work, it redirects me on the action route with error 419, this is an example of my form:
<form action="{{route('client.login')}}" method="POST">
#csrf
#method('POST')
<h4 class="login-title">Login</h4>
<div class="login-form">
<div class="row">
<div class="col-md-12 col-12 mb--20">
<label>Email*</label>
<input class="mb-0" type="email" name="email" value="{{ old('email') }}">
</div>
<div class="col-12 mb--20">
<label>Password</label>
<input class="mb-0" type="password" autocomplete="current-password" name="password"
value="{{ old('password') }}">
</div>
<div class="col-md-12">
<div class="d-flex align-items-center flex-wrap">
<button type="submit" class="btn btn-black me-3">Login</button>
<div class="d-inline-flex align-items-center">
<input type="checkbox" id="remember" name="remember" class="mb-0 me-1">
<label for="remember" class="mb-0 font-weight-400">Ricordami</label>
</div>
</div>
#if (Route::has('password.request'))
<p>Password dimenticata?</p>
#endif
</div>
</div>
</div>
</form>
I've checked the csrf tokens, and they match.
I've the exact same code on my server-side files and they work perfectly, but doesn't work on my local server.
I can't find anywhere the log of this error.
EDIT:
My issue was in the .env file, I’ve written a ; rather than a :
Remove #method('POST') this line and try because you don't need to mention method="POST", you already mentioned method in form tag.
Welcome you in advance.
Try to add <meta name="csrf-token" content="{{ csrf_token() }}"> in the head of app.blade.php file

RESOLVED: Laravel - Can't make "submit form" route to show up

RESOLVED!
I just needed to access "links.test/submit" instead of simply "links.test", as "submit.blade.php" was a new page.
I also learned the tutorial uses an older version of Laravel, meaning "resources/views/layouts/app.blade.php" was not created because the
php artisan make:auth
command did not work. For Laravel 7, as Gustavo Alves pointed out, I needed to use these two commands instead:
composer require laravel/ui
php artisan ui vue --auth
ORIGINAL QUESTION:
I am going through a Laravel tutorial for beginners - https://laravel-news.com/your-first-laravel-application. I came to the "Displaying the Link Submission Form" section and pasted the provided code snippet into the routes/web.php file, then created submit.blade.php template at resources/views/submit.blade.php with the provided code snippet, as per instructions.
However, the submit form is NOT showing up in my "links.test".
web.php:
?php
use Illuminate\Support\Facades\Route;
Route::get('/', function () {
$links = \App\Link::all();
return view('welcome', ['links' => $links]);
});
Route::get('/submit', function () {
return view('submit');
});
submit.blade.php:
#extends('layouts.app')
#section('content')
<div class="container">
<div>
<h1>Submit a Link </h1>
<form action="/submit" method="post" >
#if ($errors->any())
<div class="alert alert-danger" role="alert">
Plese fix the following errors
</div>
#endif
{!!csrf_field()!!}
<div class="form-group{{ $errors->has('title') ? 'has-error' : ''}}">
<label for="title">Title</label>
<input type="text" class="form-control" id="title" name="title" placeholder="Title" value="{{ old('title') }}">
#if($errors->has('title'))
<div class="alert alert-danger">
{{ $errors->first('title') }}
</div>
#endif
</div>
<div class="form-group{{ $errors->has('url') ? ' has-error' : '' }}">
<label for="url">Url</label>
<input type="text" class="form-control" id="url" name="url" placeholder="URL" value="{{ old('url') }}">
#if($errors->has('url'))
<span>
<div class="alert alert-danger">
{{ $errors->first('url') }}
</div>
</span>
#endif
</div>
<div class="form-group{{ $errors->has('description') ? ' has-error' : '' }}">
<label for="description">Description</label>
<textarea class="form-control" id="description" name="description" placeholder="description">{{ old('description') }}</textarea>
#if($errors->has('description'))
<div class="alert alert-danger">
{{ $errors->first('description') }}
</div>
#endif
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
#endsection
So, what I can gather for your comment is
you need to create resources\views\layouts\app.blade.php where you will have something like this
<!DOCTYPE html>
<html lang="en">
<head>
<title>Your App</title>
#section('head')
<!-- Styles -->
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
#show()
</head>
<body>
#yield('content')
#section('scripts')
<script src="{{ mix('/js/app.js') }}"></script>
#show
#endsection
</body>
</html>
Once you got this you should be able to extend and this should work as well.

LARAVEL_MethodNotAllowedHttpException

I read other answers about my question but they were useless for me.
I can't solve this error.
<form method="post" action="/cards/{{ $cards->id }}/notes">
<div class="form-group">
<textarea name="body" title="body" class="form-control" style="text-align: center"></textarea>
</div>
<div>
<button type="submit" class="btn btn-primary">Add Note</button>
</div>
</form>
and :
Route::get('cards', 'CardsController#index');
Route::get('cards/{cards}', 'CardsController#show');
Route::post('cards/{cards}/notes', 'NotesController#store');
thank for your help
You might need to add a CSRF token to your form. Try this:
<form method="post" action="/cards/{{ $cards->id }}/notes">
{{ csrf_field() }}
<div class="form-group">
<textarea name="body" title="body" class="form-control" style="text-align: center"></textarea>
</div>
<div>
<button type="submit" class="btn btn-primary">Add Note</button>
</div>
</form>

How to get Ckeditor textarea value in laravel

i am using Ckeditor for blog posting in my project when i submit the form nothing i am get in controller can any one suggest me solution for that.
my view is looking like
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Post</div>
<div class="panel-body">
<form class="form-horizontal" role="form" method="POST" action="{{ route('store-post') }}">
{{ csrf_field() }}
<div class="form-group">
<label for="category_id" class="col-md-2 control-label">Select Categories</label>
<div class="col-md-8">
<select class="form-control" id="category_id" name="category_id">
#foreach($categories as $category)
<option value="{{$category->url_name}}">
{{$category->category_name}}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group">
<label for="email" class="col-md-2 control-label">Post Title</label>
<div class="col-md-8">
<input id="post_title" type="text" class="form-control" name="post_title" value="{{ old('post_title') }}">
</div>
</div>
<div class="form-group">
<label for="post_content" class="col-md-2 control-label">Post Description</label>
<div class="col-md-8">
<textarea id="post_content" rows="10" cols="60" class="span8" placeholder="Image Title Goes Here" name="post_content"></textarea>
</div>
</div>
<div class="form-group">
<label for="p_url" class="col-md-2 control-label">Post Url</label>
<div class="col-md-8">
<input id="p_url" type="text" class="form-control" name="p_url" value="{{ old('p_url') }}">
</div>
</div>
<div class="form-group">
<label for="p_title" class="col-md-2 control-label">Meta Title</label>
<div class="col-md-8">
<input id="p_title" type="text" class="form-control" name="p_title" value="{{ old('p_title') }}">
</div>
</div>
<div class="form-group">
<label for="p_keyword" class="col-md-2 control-label">Meta Keyword</label>
<div class="col-md-8">
<input id="p_keyword" type="text" class="form-control" name="p_keyword" value="{{ old('p_keyword') }}">
</div>
</div>
<div class="form-group">
<label for="email" class="col-md-2 control-label">Meta Description</label>
<div class="col-md-8">
<textarea class="form-control" id="p_mdesc" name="p_mdesc" rows="3">
</textarea>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-2">
<button type="submit" class="btn btn-primary">
Submit
</button>
</div>
</div>
<!--Error start-->
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
<!--error ends-->
</form>
</div>
</div>
</div>
</div>
</div>
my controller code is
public function store(Request $request){
/*$this->validate($request, [
'category_id' => 'required',
'post_title' => 'required',
//'post_content' => 'required',
'p_url' => 'required',
'p_title' => 'required',
'p_keyword' => 'required',
'p_mdesc' => 'required',
]);*/
$post=new Post;
echo $post_content=$request->input('post_content');
}
in previous project ie designed in CI i just use
$tc=$this->input->post('tc'); in controller for getting the Ckeditor value but in laravel i am not sure how to get it done.
Your view contain 2 name attribute for the post_content field (textarea). Please check.
You can do it like this -
{!! Form::textarea('tc', $tc,array('required', 'class'=>'form-control', placeholder'=>'Your message')) !!}
and then you will have to initialise it
$(document).ready(function () {
CKEDITOR.replace( 'tc' );
});
The documentation has clear examples.
In your Blade you should add ckeditor like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A Simple Page with CKEditor</title>
<!-- Make sure the path to CKEditor is correct. -->
<script src="../ckeditor.js"></script>
</head>
<body>
<form>
<textarea name="editor1" id="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.
</textarea>
<script>
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'editor1' );
</script>
</form>
</body>
</html>
So the javascript code triggers a replace of a textarea to the editor
Now for the retrieving data part
<script>
var data = CKEDITOR.instances.editor1.getData();
// Your code to save "data", usually through Ajax.
</script>
You need to create an endpoint if you want to send this data indeed trough Ajax. Don't forget to add a CSRF token
As mentioned by #user3888958,
<textarea name="tc" id="post_content" rows="10" cols="60"
class="span8" placeholder="Image Title Goes Here" name="post_content">
the textarea has two name attribute.
You could access the textarea content using the name attribute, remove any one name attribute and pass that in as a parameter to the request
$request->input('tc'); // OR
$request->input('post_content');
and to access the value of
<textarea class="form-control" id="p_mdesc" name="p_mdesc" rows="3">
</textarea>
you could access it using the name
$request->input('p_mdesc');

return withSuccess withErrors lost

I'm using a request validation to validate my form post which works fine for a "simple" contact class but not for my posts class.
Working:
ContractController GET:
public function showForm()
{
return view('contact');
}
ContractController POST:
public function sendContactInfo(ContactRequest $request)
{
blabla
return back()
->withSuccess("Thank you");
}
not working:
postcontroller GET:
public function changepost($postid)
{
$postdetail = posts::find($postid);
blabla
return view('changepost')->with("postdetail", $postdetail);
}
postcontroller POST:
public function changepostvalues(changepostreqeust $request)
{
blabla
return back()->withSuccess("Thank you");
}
withSuccess and withError is only stored for the next request, correct?
I've also tried to use Session:flash with the same result, success and error are not in the session.
when I try Session::put all work fine. however I don't want to store the messeage permanently in the session and I also want to understand why the infromations are lost...
I believe it has something to do with the return view('changepost')->with("postdetail", $postdetail); where I need to pass also the error and success messages....
Thanks.
EDIT
Add View
#extends('master')
#section('title', 'lala')
#section('sidebar')
#parent
#endsection
#section('page-script')
<link href="{{ asset('/packages/dropzone/dropzoneaddpost.css') }}" rel="stylesheet">
#foreach($images as $image)
<meta name="postimage" content="{{$image->image_path}}" id="{{$image->id}}">
#endforeach
#stop
#section('content')
<div align="center">
<div class="addpost">
#if (Session::has('success'))
<div class="alert alert-info">{{ Session::get('success') }}</div>
#endif
<div class="row">
<div class="files" id="previews">
<div id="template" class="file-row">
<!-- This is used as the file preview template -->
<div>
<span class="preview"><img data-dz-thumbnail /></span>
</div>
<div>
<strong class="error text-danger" data-dz-errormessage></strong>
</div>
<div style="text-align: center;">
<button data-dz-remove class="btn delete mydelbutton">
<i class="glyphicon glyphicon-trash"></i>
</button>
</div>
</div>
</div>
</div>
<div class="row">
<form action="/changepost" method="post">
<div class="form-group">
<label for="txttitle">Titel:</label>
<input class="form-control" id="txttitle" type="text" name="beschreibung" id="beschreibung" maxlength="45" style="" value='{{ $postdetail->beschreibung }}'>
<label for="txtmessage">Beschreibung:</label>
<textarea id="txtmessage" class="form-control" rows="5" name="description" id="description" maxlength="500">{{$postdetail->text}}</textarea>
</div>
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<input type="hidden" name="postid" value="{{ $postdetail->id }}">
<button id="savepost" class="btn mybutton start">
<i class="glyphicon glyphicon-upload"></i>
<span>Save</span>
</button>
</form>
</div>
</div>
</div>
</div>
<script src="{{ asset('/packages/dropzone/dropzone.js') }}"></script>
<script src="{{ asset('/packages/dropzone/dropzone-config.js') }}"></script>
#stop

Resources