Merging dropzone.js with my form - laravel

I'm creating a form that uses dropzone.js, I've managed to do it by having the drag and drop image by itself. The problem I'm having is that I'm struggling to merge dropzone with the form I'm having. If I add the dropzone class to my form then my whole form is the dropzone but I just want a section to be the dropzone.
Hope I explained it properly.
Here is my create.blade.php
{{ Form::open(array('route' => 'menus.store', 'class' => 'add-form')) }}
<div class="form">
<div class="parents_input">
<div>
{{ Form::label('menu_id', 'Parent Menu')}}
</div>
<div>
{!! Form::select('menu_id', $menu_id->prepend('Please Select', '0'), null, array("class" => "form-control")) !!}
</div>
</div>
<div class="title_input">
<div>
{{ Form::label('title', 'Title') }}
</div>
<div>
{{ Form::text('title','', array('id' => 'title', "class" => "form-control")) }}
</div>
</div>
<input type="file" name="file" class="dropzone" id="my-awesome-dropzone" />
<div class="layout_type">
<input id="home" type="radio" value="home" name="type">
<label for="home">Home</label>
<input id="stories" type="radio" value="stories" name="type">
<label for="stories">Stories</label>
</div>
<div class="submit_button">
<div>
{{ Form::submit('Submit', array("class" => "btn btn-info submit", "role" => "button")) }}
</div>
</div>
</div>
{{ Form::close() }}

you have to add dropzone in one separate div.
<script src="../../assets/dropzone/js/dropzone.js"></script>
<link type="text/css" rel="stylesheet"
href="../../assets/dropzone/css/dropzone.css">
<div class="">
<div action="" id="dZUpload" class="dropzone" method="post"
enctype="multipart/form-data">
</div>
</div>
after that initialise dropzone.

Related

Insert into database postgres with october cms

Hi all I am new into october cms and I am facing trouble that makes my head spinning around. I have a form that get data from user, I am using builder.
This is my form :
{% put sudah %}{% partial "expert/yes" %}{% endput %}
{% put styles %}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Ubuntu:wght#300;400;500;600;700&display=swap">
{% endput %}
<div class="text-center bg-primary">
<h4 class="text-white my-auto py-5 title-menu">Expert Registration Form</h4>
</div>
<div class="opening" id="first-menu">
<p>Expert Registration Form</p>
<button onclick="changeMenu()" class="btn btn-primary">
Bergabung
<i class="fa fa-arrow-right" aria-hidden="true"></i>
</button>
</div>
<div class="tab-content d-none pb-4" id="second-menu">
<div class=" container">
<div class="head-menu">
<p>Have you registered yet ?</p>
</div>
<div class="p-2">
<div class="form-check my-3">
<input class="form-check-input" type="radio" name="radioPick" id="yes" value="yes" checked>
<label class="form-check-label" for="radioPick">Yes</label>
</div>
<div class="form-check my-3">
<input class="form-check-input" type="radio" name="radioPick" id="no" value="no">
<label class="form-check-label" for="radioPick">No</label>
</div>
</div>
<div class="btn-next mt-4">
<button onclick="secondMenu()" class="btn btn-primary">Next</button>
</div>
</div>
</div>
<div id="yes" class="d-none">
{% placeholder yes%}
</div>
{% put scripts %}
<script>
const changeMenu = () => {
$( "#first-menu" ).addClass('d-none');
$( "#second-menu" ).removeClass('d-none');
}
const secondMenu = () => {
let radio = $('input[name=radioPick]:checked').val()
$( "#second-menu" ).addClass('d-none');
if(radio === 'yes'){
$( "#yes" ).removeClass('d-none');
}
}
</script>
{% endput %}
Then if yes, form for yes appeared
this is yes form :
<form method="POST" action="" accept-charset="UTF-8" enctype="multipart/form-data" id="example" class="something">
<input type="hidden" name="handler" value="onSave">
{{ form_token() }}
{{ form_sessionKey() }}
<div class="tab-content py-4" id="second-menu">
<div class="container">
<div class="content-letter tab">
<p class="title-letter">Please Fill This Form</p>
<div class="content-letter tab">
<div class="mt-3">
<div class="form-group row">
<div class="col-12">
<label class="text-dark font-weight-bold">Nama</label>
<input type="text" class="form-control" placeholder="Name" name="name"
id="name" required>
</div>
</div>
<div class="form-group row">
<div class="col-12">
<label class="text-dark font-weight-bold">Phone</label>
<input type="number" class="form-control" placeholder="Phone" name="phone"
id="phone" required>
</div>
</div>
<div class="form-group row">
<div class="col-12">
<label class="text-dark font-weight-bold">Signature</label>
<div class="row">
<div class="col-9 col-md-10">
<div class="custom-file">
<input type="file" id="signature" class="custom-file input-file"
name="signature" accept="image/x-png,image/gif,image/jpeg">
<label id="label-sign" for="sign"
class="custom-file-label label-files">Upload Signature</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<button
id="btn-okay"
type="submit"
data-request="onSave"
data-hotkey="ctrl+s, cmd+s"
data-load-indicator="Creating New..."
class="btn btn-primary">
Join
</button>
</div>
</div>
</form>
and in code section I wrote this function :
function onSave() {
$expert= new Expert();
$model = new \Models\Expert;
$expert->name = Input::get('name');
$expert->phone = Input::get('phone');
$expert->sign= Input::file('signature');
$expert->save();
return Redirect::back;
//or even this one
/*$nama = Input::get('name');
$phone = Input::get('phone');
$sign = Input::file('signature');
DB::table('expert')->insert([
'name' => $name,
'phone' => $phone,
'sign' => $sign
]);
return Redirect::back;*/
}
and not forget I attach model in expert model :
public $attachOne = [
'signature' => 'System\Models\File'
];
Please help me, what is wrong with my code ? Thank you
Check the documents out on working with models. Your php function should be:
use Author\Plugin\Models\Expert;
function onSave() {
$expert= new Expert;
$expert->name = Input::get('name');
$expert->phone = Input::get('phone');
$expert->sign = Input::file('signature');
$expert->save();
return Redirect::back;
}

Missing required parameters for route (Laravel 5.8)

I'm trying to recreate a blog application form old laravel version in new version (5.8). In old version, I used laravel collective for forms, and my edit post form looks like this:
#extends('layouts.app')
#section('content')
<h1>Edit Post</h1>
{!! Form::open(['action' => ['PostsController#update', $post->id], 'method' => 'POST', 'enctype' => 'multipart/form-data']) !!}
<div class="form-group">
{{Form::label('title', 'Title')}}
{{Form::text('title', $post->title, ['class' => 'form-control', 'placeholder' => 'Title'])}}
</div>
<div class="form-group">
{{Form::label('body', 'Body')}}
{{Form::textarea('body', $post->body, ['class' => 'form-control', 'placeholder' => 'Body Text'])}}
</div>
{{Form::hidden('_method', 'PUT')}}
{{Form::submit('Submit', ['class'=>'btn btn-primary'])}}
{!! Form::close() !!}
#endsection
Now I'm trying to recreate the same form without laravel collective forms because it seems to be deprecated.
This is my attempt at recreating this form:
#extends('layouts.app')
#section('content')
<h1>Edit post</h1>
<form action="{{ route('posts.update'), $post->id }}" method="POST">
#csrf
<div class="form-group">
<label for="title">Title</label>
<input class="form-control" type="text" id="title" name="title" value={{$post->title}}>
</div>
<div class="form-group">
<label for="body">Body</label>
<textarea class="form-control" id="body" rows="3" name="body" value={{$post->body}}></textarea>
</div>
<input type="submit" class="btn btn-primary">
</form>
#endsection
I'm getting the following error:
Missing required parameters for [Route: posts.update] [URI: posts/{post}]. (View: C:\xampp\htdocs\blog\resources\views\posts\edit.blade.php)
Looks like I'm not sending the id parameter correctly.
Also,how can I recreate this part: {{Form::hidden('_method', 'PUT')}} in plain HTML?
You can recreate the method input with this:
#method('PUT')
You need to put the $post->id inside the route() and use the Form method Spoofing (#method('PUT')). Try this:
#extends('layouts.app')
#section('content')
<h1>Edit post</h1>
<form action="{{ route('posts.update', $post->id) }}" method="POST">
#csrf
#method('PUT')
<div class="form-group">
<label for="title">Title</label>
<input class="form-control" type="text" id="title" name="title" value={{$post->title}}>
</div>
<div class="form-group">
<label for="body">Body</label>
<textarea class="form-control" id="body" rows="3" name="body" value={{$post->body}}></textarea>
</div>
<input type="submit" class="btn btn-primary">
</form>
#endsection
Your error is caused by $post->id being outside of the route() function.
Change:
route('posts.update'), $post->id
to:
route('posts.update', $post)
As for the second question, this is how Form::hidden('_method', 'PUT') is rendered as HTML:
<input type="hidden" name="_method" value="PUT">
But you can use #method if you prefer a shorter way of writing it:
<form action="{{ route('posts.update', $post) }}" method="POST">
#method('PUT')
#csrf
...
</form>

Strange view error on Laravel

I have some cotroller like this:
Route::get('/article/create', 'ArticlesController#create');
and here's my ArticlesController#create:
public function create(){
return view('articles.create',
[
'title'=>'Add Artikel',
'username'=>'Whatever Myname',
'status' => 'Offline'
]
);
}
when i trying to access blog.dev/article/create i got this strange errors:
"Trying to get property of non-object (View: E:\xampp\htdocs\blog\resources\views\articles\single.blade.php)"
how come i can get this kind of error when my view is pointing at articles.create but the error is at single.blade.php which it suppose for ArticlesController#view?
this is what in create.blade.php:
#extends('admin.layout')
#section('content')
<div class="box box-info">
<div class="box-header with-border">
<h3 class="box-title">Horizontal Form</h3>
</div>
#include('admin.formerrors')
<form method="post" class="form-horizontal" action="/articles">
{{ csrf_field() }}
<div class="box-body">
<div class="form-group">
<label for="title" class="col-sm-2 control-label">Title</label>
<div class="col-sm-10">
<input class="form-control" id="title" name="title" placeholder="Judul Artikel">
</div>
</div>
<div class="form-group">
<label for="content" class="col-sm-2 control-label">Content</label>
<div class="col-sm-10">
<textarea class="form-control" rows="3" id="content" name="content"></textarea>
</div>
</div>
<div class="box-footer">
<button type="submit" class="btn btn-primary">Save</button>
</div>
</form>
</div>
#endsection
and here's in my single.blade.php :
#extends('admin.layout')
#section('content')
<h1>{{ $article->title }}</h1>
<p>{{ $article->content }}</p>
<hr>
#foreach($article->comments as $comment)
<blockquote>
<p>{{ $comment->comment }}</p>
<small>{{ $comment->created_at->diffForHumans() }}</small>
</blockquote>
#endforeach
#include('admin.formerrors')
<form method="post" class="form-horizontal" action="/article/{{ $article->id }}/comment">
{{ csrf_field() }}
<div class="box-body">
<div class="form-group">
<label for="comment" class="col-sm-2 control-label">Comment</label>
<div class="col-sm-10">
<textarea class="form-control" rows="3" id="comment" name="comment"></textarea>
</div>
</div>
<div class="box-footer">
<button type="submit" class="btn btn-primary">Save</button>
</div>
</form>
#endsection
and here's my router:
Route::get('/articles', 'ArticlesController#index')->name('home');
Route::post('/articles', 'ArticlesController#save');
Route::get('/article/{id}', 'ArticlesController#view');
Route::get('/article/create', 'ArticlesController#create');
Route::post('/article/{article}/comment', 'CommentsController#save');
Route::get('/register', 'RegistrationController#create');
Route::post('/register', 'RegistrationController#store');
I try to change the create function by pointing into another view, but still it showing same error and pointing at single.blade view.
I delete all code at single.blade and write 'test' text, i don't get any errors. but i'm pointing my controller for viewing into create.blade not sigle.blade
After seeing you routes the problem is in this two routes :
Route::get('/article/{id}', 'ArticlesController#view');
Route::get('/article/create', 'ArticlesController#create');
In this case Laravel will consider the create in your path blog.dev/article/create as an id parameter of the view route here => /article/{id}.
So as a solution you should simply inverse the two routes :
Route::get('/article/create', 'ArticlesController#create');
Route::get('/article/{id}', 'ArticlesController#view');
You need to find what's in the file by reading more than just that line. Maybe you're including that file in the articles.create? Maybe you're accessing a variable that doesn't exist whenever you load the page. Edit your answer with more of the error and what's inside both blades and we can pinpoint what's wrong.

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');

Laravel 5 Missing route doesn't throw Exception

I'm having an issue my missing routes behaviour. If I try a random URL no exception is thrown I get an
Undefined variable: errors
instead of the 404 page that I have created. The thing is that if I try to access an object that doesn't exist in database from a valid existing route, the 404 error is thrown and the page is rendered like it should.
I have a layout for my error pages that includes a topbar and within that bar there is a modal form that I include in the master layout(the undefined error comes from that modal apparently):
mastererror.blade.php:
<!DOCTYPE html>
<html>
<head>
<title>#yield('title')</title>
<!-- Load CSS -->
#include('assets.css')
<!-------------->
<!-- Load jQuery -->
<script src="{{ URL::asset('js/jquery-2.1.4.min.js')}}"></script>
<!----------------->
</head>
<body>
<!-- Load Navbar -->
#include('elements.html.navbartop')
<!----------------->
<div class="pusher">
<div id="content" class="ui main container" style="margin: 70px 0px 50px 0px">
<!-- Load Content -->
#yield('content')
<!------------------>
</div>
</div>
<!-- Load Footer -->
#include('elements.html.footer')
<!----------------->
<!-- Load JavaScript -->
#include('assets.js')
<!--------------------->
<!-- Load login Modal -->
#include('elements.html.partials.login-modal')
<!---------------------->
</body>
</html>
404.blade.php:
#extends('layout.mastererror')
#section('title', 'Not Found.')
#section('content')
<div style="margin-top: 30px">
<img class="ui medium image centered" src="{{asset('images/notfound.png')}}">
<h1 class="ui header centered">404 Not Found.</h1>
#if($exception->getMessage() !== '')
<h2 class="ui header centered">{{ $exception->getMessage() }}.</h2>
#else
<h2 class="ui header centered">The resource is missing.</h2>
#endif
<h3 class="ui header centered">Home </h3>
</div>
#endsection
login-modal.blade.php:
<div class="ui small modal" id="loginModal">
<i class="circular close icon inverted"></i>
<div class="header">
Login
</div>
<div class="ui active dimmer" id="loader" style="display: none">
<div class="ui text loader">Loading</div>
</div>
<div class="content">
<div class="ui grid">
<div class="eight wide column centered">
{!! Form::open(array('route' => 'auth.login', 'method' => 'post','id'=>'formLogin','class' => 'ui large form')) !!}
<div class="field {!! $errors->has('username') ? 'error' : '' !!}">
<div class="ui left icon input">
<i class="user icon"></i>
{!! Form::text('username','',['name'=>'username','id'=>'username','class' => 'pd','placeholder'=>'Pseudo']) !!}
</div>
{!! $errors->first('username', '<span class="ui text" id="" style="color: #bf4d4b">:message</span>') !!}
</div>
<div class="field {!! $errors->has('password') ? 'error' : '' !!}">
<div class="ui left icon input">
<i class="lock icon"></i>
{!! Form::password('password',['name'=>'password','id'=>'password','class' => '','placeholder'=>'Mot de passe']) !!}
</div>
{!! $errors->first('password', '<span class="ui text" id="" style="color: #bf4d4b">:message</span>') !!}
</div>
{!! Form::submit('Login',['id'=>'loginButton','class'=>'ui fluid large teal submit button']) !!}
{!! Form::close() !!}
<div class="ui message">
<p>Mot de passe oublié? {{ link_to_route('password.forgot','Réinitialiser',null,null) }}</p>
<p>Pas encore membre? {{ link_to_route('auth.register','s\'Enregistrer',null,null) }}</p>
</div>
</div>
</div>
</div>
</div>
The magic $errors variable is not generated when an error is thrown (discussed in more detail here: https://github.com/laravel/framework/issues/11457).
You'll need to do an isset($errors) on any templates you include that reference $errors
<div class="field {!! isset($errors) ? ( $errors->has('username') ? 'error' : '' ) : '' !!}">
for now I added this route to catch any invalid routes:
Route::any('{catchall}', function($page){
abort(404,"the page '$page' doesnt exist");
})->where('catchall', '(.*)');

Resources