Merging laravel's Form class with Bootstraps form-group class - php

I have a form in laravel to edit a post using bootstrap:
#section('content')
<form method="PUT" action="{{ URL::route('post.update', array($post->id)) }}">
<div class="form-group">
<label for="usr">Title:</label>
<input type="text" class="form-control" id="usr" name="title" value="{{$post->title}}">
<br>
<label for="comment">Details:</label>
<textarea class="form-control" rows="5" id="comment" name="detail"
placeholder="Write a new post.">"{{$post->message}}"</textarea>
<input type="hidden" name="id" value="add">
</div>
Cancel
<div class="pull-right">
<input type="submit" class="btn btn-success" value="Update">
</div>
</form>
#stop
It looks like this:
Now, if I use Laravel's Form class, it's much smaller and neater:
{{Form::model($post, array('method' => 'PUT', 'route' => array('post.update', $post->id)))}}
{{ Form::label('title', 'Post Title: ') }}
{{ Form::text('title') }}
{{ $errors->first('title') }}
<p></p>
{{ Form::label('message', 'Post Message: ') }}
{{ Form::text('message') }}
{{ $errors->first('message') }}
<p></p>
{{ Form::submit('Update') }}
{{ Form::close() }}
However, this causes the form to look quite ugly:
So, in short, is there anyway to use Laravel's form class and add boostrap styling/buttons to it? I want the functionality and easy of use of the form class with the visuals of bootstrap.

You need to add the class to each input (here is an exemple)
{{Form::model($post, array('method' => 'PUT', 'route' => array('post.update', $post->id)))}}
{!! Form::label('title','Post Title: ', array('class' => 'pull-left')) !!}
{!! Form::text('title', null, ['class' => 'form-control'])!!}
{!! Form::label('message','Post Message: ', array('class' => 'pull-left')) !!}
{!! Form::textarea('message', null, ['class' => 'form-control'])!!}
<br>
Cancel
{!! Form::submit('Update', ['class' => 'btn btn-success pull-right']) !!}
{!! Form::close() !!}

Related

how to retrieve data from database into input values of a form in laravel php to complete the update action?

I'm trying to populate data into input values from mysql database so that I can see and change the data.
I have a form named form.blade.php which will be included in both create.blade.php and edit.blade.php.
What I need is to know is how to retrive data from database to populate data to those inputs when I click on edit.Then when I click on Add button in index.blade.php ,I'll be redirected to create.blade.php and then inputs must be empty.
I tried to add some code functions to every input value
{{old('title',$page->title}} then {{ isset($page) ? page->title: ''}}
but its not working
I'm using one form to perform create and update actions
This is the edit.blade.php
#extends('layouts.master')
#section('content')
<div class="card">
<div class="card-header card-header-success">
<h4 class="card-title ">Pages Data Table</h4>
<p class="card-category"> Here you can update Page data</p>
</div>
<div class="card-body">
{!! Form::open(['action' => 'PagesController#store', 'method' => 'POST' ]) !!}
#csrf
#method('PUT')
#include('pages.includes.form')
{!! Form::close() !!}
</div>
</div>
#endsection
and this is the child form form.blade.php
<div class="form-group">
{{Form::label('title', 'Title')}}
{{ Form::text('title', '',['class' => 'form-control', 'placeholder' => 'Title']) }}
</div>
<div class="form-group">
{{Form::label('content', 'Content')}}
<br>
{{ Form::textarea('content', '',['class' =>'form-control', 'placeholder'=> 'Content']) }}
</div>
<div class="form-group">
<div class="form-check form-check-radio">
<label class="form-check-label">
{{Form::input('radio','status', '0',['class' => 'form-check-input','checked'=>'checked'])}} Status Off
<span class="circle">
<span class="check"></span>
</span>
</label>
</div>
<div class="form-check form-check-radio">
<label class="form-check-label">
{{Form::input('radio','status', '1',['class' => 'form-check-input'])}} Status On
<span class="circle">
<span class="check"></span>
</span>
</label>
</div>
</div>
<input type="submit" name="submit" class="btn btn-success" value="Save">
When you are using the same form for create and update, you can use the optional method.
<input type="text" class="form-control{{ $errors->has('date') ? ' is-invalid' : '' }}" name="date" id="date" value="{{ old('date', optional($expense)->date) }}">
In the create function send the variable as null like $expense = null;
And in edit function the variable has its own value from database. So when the variable has its value the input field will be filled by value from database otherwise it will be empty.

Laravel 5.7 MethodNotAllowedHttpException

I am getting an MethodNotAllowedHttpException error while im trying to update mine post. So I googled the error and found this laravel throwing MethodNotAllowedHttpException but it get explained that i need to make the route
an post request, where mine form actions go thruw but its already a post and it keeps throwing the same error and i cant figure out if the erros is in the form the web.php or the controller it self
edit.blade.php
<form method="POST" action="/posts/{{ $post->id }}/edit">
{{ csrf_field() }}
#method('PUT')
<div class="form-group">
<label for="title">Title:</label>
<input type="text" class="form-control" id="title" name="title" value="{{ $post->title }}">
</div>
<div class="form-group">
<label for="body">Body:</label>
<textarea id="body" name="body" class="form-control" rows="10">
{{
$post->body
}}
</textarea>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Edit</button>
</div>
#include('layouts.errors')
</form>
Web.php
Route::get('/', 'PostsController#index')->name('home');
Route::get('/posts/create', 'PostsController#create');
Route::post('/posts', 'PostsController#store');
Route::get('/posts/{post}', 'PostsController#show');
Route::get('/posts/{post}/edit', 'PostsController#edit');
Route::post('/posts/{post}/edit', 'PostsController#update');
Route::get('/posts/{post}/delete', 'PostsController#destroy');
PostsController.php
(this is the part that matters out of the controller if u want me to post the hole controller let me know)
public function edit(Post $post)
{
return view('posts.edit', compact('post'));
}
public function update(Request $request, Post $post)
{
$request->validate([
'title' => 'required',
'body' => 'required'
]);
$post->update($request->all());
return redirect('/')->with('succes','Product updated succesfully');
}
You should try this:
View file:
<form method="POST" action="{{ route('post.update',[$post->id]) }}">
{{ csrf_field() }}
<div class="form-group">
<label for="title">Title:</label>
<input type="text" class="form-control" id="title" name="title" value="{{ $post->title }}">
</div>
<div class="form-group">
<label for="body">Body:</label>
<textarea id="body" name="body" class="form-control" rows="10">
{{
$post->body
}}
</textarea>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Edit</button>
</div>
#include('layouts.errors')
</form>
Your Route
Route::post('/posts/{post}/edit', 'PostsController#update')->name('post.update');
You are submitting the form with the put method as defining #method('PUT') will make it a put route. Either define a route for put method like this Route::put('/posts/{post}/edit', 'PostsController#update'); or remove #method('PUT') from your blade file.
This problem 1 week took me but i solve it with routing
In edit.blade.php
{!! Form::open([route('post.update',[$post->id]),'method'=>'put']) !!}
<div class="form-group">
<label for="title">Title:</label>
{!! Form::text('title',$post->title,['class'=>'form-control',
'id'=>'title']) !!}
</div>
<div class="form-group">
<label for="body">Body:</label>
{!! Form::textarea('body', $post->body, ['id' => 'body', 'rows' => 10,
class => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::submit('Edit',['class'=>'btn btn-block bg-primary',
'name'=>'update-post']) !!}
</div>
{!! Form::close() !!}
#include('layouts.errors')
In Web.php
Route::resource('posts','PostsController');
Route::get('/posts/{post}/delete', 'PostsController#destroy');
Route::put('/posts/{post}/edit',['as'=>'post.update',
'uses'=>'PostController#update']);
Route::get('/', 'PostsController#index')->name('home');
Laravel will throw a MethodNotAllowedHttpException exception also if a form is placed by mistake this way inside a table:
<table><form><tr><td>...</td></tr></form><table>
instead of this :
<table><tr><td><form>...</form></td></tr></table>

Multiple values in laravel post form (dropdown)

Good day fellow programmers,
I have been frustrated all day because I have to make a submit form for an hour register app I have to create for the company I'm an intern at.
So basically what has to be done: I have made a submit form with multiple values, I got asked to make a dropdown selection in which I can put the values of "company name" and "task name". (tasks are connected to the company name). So basically what i'm wondering is how I can put 2 values in one dropdown menu. Having the layout of "$company name - $task name"
create.blade.php
{!! Form::open(['url' => 'hoursregistrations/create','files'=>true]) !!}
<div class="form-group" hidden>
{!! Form::label('user_id', 'User ID: ') !!}
{!! Form::text('user_id', $authenticated, null, ['class' => 'form-control']) !!}
</div>
<select name="">
#foreach($items as $item)
<option value="{{ $item->id }}">
{{ $item->company->name }} - {{ $item->name }}
</option>
#endforeach
</select>
<div class="form-group">
{!! Form::label('note', 'Notitie: ') !!}
{!! Form::text('note', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('date', 'Datum: ') !!}
{!! Form::date('date', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('hours', 'Uren: (uren-minuten) ') !!}
{!! Form::time('hours', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-4">
<a class="btn btn-danger" href="{{ route('hoursregistrations.index') }}">
#lang('button.cancel')
</a>
<button type="submit" class="btn btn-success">
#lang('button.save')
</button>
</div>
</div>
{!! Form::close() !!}
In this code snippet the company variable is $project_id and the task id is $subproject_id.
Also the controller function to redirect the data to the create view
/**
* Show the form for creating a new resource.
*
* #return Response
*/
public function create()
{
$authenticated = Sentinel::getUser()->id;
$activity_name = Subproject::pluck('id');
$items = array(
'company_name' => Company::where('status','client')->pluck('company_name', 'id'),
'subproject_id' => Subproject::pluck('title', 'id')
);
//dd($items);
return view('hoursregistrations.create', compact('subproject_id', 'authenticated',
'company_name', 'activity_name', 'items'));
}
Conclusion: How can I combine the $project_id and $subproject_id into ONE dropdown item.
p.s I'm sorry if it sounds vague I am bad at explaining things
Do you have to use The Form Facade? Although this may not be helpfull to you, you can write it as plain HTML with Blade's Syntax:
<select name="">
#foreach($tasks as $task)
<option value="{{ $task->id }}">
{{ $task->company->name }} - {{ $task->name }}
</option>
#endforeach
</select>

Laravel reset value in input after validation fail?

I'm so confuse now, I'm learning Laravel from Laracast, according to the instructor, after validation fail, the form does not reset values that user entered. But when testing validation, when I submit the form reset every thing.
Another question is the undefined variable $errors when I try to access it.
My Controller
<?php
namespace App\Http\Controllers;
use App\Articles;
use App\Http\Requests\CreateArticle;
use Carbon\Carbon;
use App\Http\Requests;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
class ArticlesController extends Controller
{
public function create()
{
return view('articles.create');
}
public function store(Request $request)
{
$this->validate($request, [
'title' => 'required',
'body' => 'required'
]);
Articles::create($request->all());
return redirect('articles');
}
}
My View
#extends('app')
#section('content')
<h1>Create a new Articles</h1>
<hr/>
{!! Form::open(['url' => 'articles']) !!}
<div class="form-group">
{!! Form::label('title', 'Title: ') !!}
{!! Form::text('title', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('body', 'Body') !!}
{!! Form::textarea('body', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('published_at', 'Published On:') !!}
{!! Form::input('text', 'published_at', date('Y-m-d'), ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::submit('submit', ['class' => 'btn btn-primary']) !!}
</div>
#if(isset($errors))
{{var_dump($errors)}}
#endif
{!! Form::close() !!}
#stop
He use v5.0 and I'm using v5.2
return the following from your controller...
return redirect('articles')->withInput();
see if that helps. you can exclude certain fields if you wanted to like this..
return redirect('articles')->withInput($request->only('email'))
If your are not using
<div class="form-group">
{!! Form::label('title', 'Title: ') !!}
{!! Form::text('title', old('title'), ['class' => 'form-control']) !!}
</div>
but have simple input fields like
<input id="Email" name="Email" type="email" class="uit-input" placeholder="your email address" value={{old('Email')}}>
'prefill' the value with the old data.
There are a couple of issues here.
The first one, the inputs not being saved after validation fails. I believe this is because you are passing null into the functions which are building the inputs when you should be passing in the value you wish it to default to. Try the following...
<div class="form-group">
{!! Form::label('title', 'Title: ') !!}
{!! Form::text('title', old('title'), ['class' => 'form-control']) !!}
</div>
This should then populate the input element with the old data which was previously entered. Just follow the same procedure for the rest of the form inputs.
The second issue with the $errors value not being set is actually due to a change with Laravel 5.2. Many people have been having the same exact issue so I'd just like to refer you to a previous answer: Laravel 5.2 $errors not appearing in Blade
Best way for you
<div class="form-group">
<label for="title">Title</label>
<input type="text" name="upload_title" class="form-control" value="{{ (old('title')) ? old('title') : $data->title}}">
</div>

Count only inputs with value in Laravel 4

I am trying to create a multiple choice quiz in Laravel,
This is the form the admin uses to insert the questions in the database, so this is not to play the quiz!
I used angular to show and hide answer C D E and F, showing only A and B when the page is loaded.
The idea is to create a for loop, so that I can insert every answer that is not empty.
How do I do this in laravel? I was thinking of count(Input::get('answer')) but it doesn't work. And even if it worked it will still count all my answers but not the ones that has a value.
All my answer inputs have the same name.
Please help!
{{ Form::open(['action' => 'QuizController#storeQuestions']) }}
{{ Form::hidden('id', $quiz->id) }}
<div class="form-group">
<label class="form-label">Question:</label>
{{ Form::text('question', Input::old('question'), array('class' => 'form-control')) }}
</div>
<div class="form-group">
<label class="form-label">Answer A:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
<div class="form-group">
<label class="form-label">Answer B:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
<!-- De '+' krijgt de showInput van de vorige input! -->
<div class="form-group">
<span class="add-question-button"><a class="plus-input" ng-click="addAnswer(1)">+</a></span>
</div>
<div ng-show="showInput1" class="form-group">
<label class="form-label">Answer C:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
<div class="form-group">
<span class="add-question-button"><a ng-show="showInput1" ng-click="addAnswer(2)" class="plus-input">+</a></span>
</div>
<div ng-show="showInput2" class="form-group">
<label class="form-label">Answer D:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
<div class="form-group">
<span class="add-question-button"><a ng-show="showInput2" ng-click="addAnswer(3)" class="plus-input">+</a></span>
</div>
<div ng-show="showInput3" class="form-group">
<label class="form-label">Answer E:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
<div class="form-group">
<span class="add-question-button"><a ng-show="showInput3" ng-click="addAnswer(4)" class="plus-input">+</a></span>
</div>
<div ng-show="showInput4" class="form-group">
<label class="form-label">Answer F:</label>
{{ Form::text('answer', Input::old('answer'), array('class' => 'form-control')) }}
{{ Form::radio('is-correct') }}
</div>
{{ Form::submit('Next question', array('class' => 'btn btn-primary btn-block')) }}
<button class="btn btn-success btn-block">Finish</button>
{{ Form::close() }}
The way you've structured the form is a bit confusing.
If this is a multiple choice quiz, then the answers should be non-editable (labels), and the user should just be required to select the correct answer using a radio button.
In that case, you can set the radio button value to the answer text (or ID, if you're pulling the available answers from a database).
For example:
<label>Who was the first man on the moon?</label>
<label>
<input type="radio" name="man_on_moon" value="Armstrong" /> Neil Armstrong
</label>
<label>
<input type="radio" name="man_on_moon" value="Aldrin" /> Buzz Aldrin
</label>
<label>
<input type="radio" name="man_on_moon" value="Hanks" /> Tom Hanks
</label>
(New answer, in response to the revised question)
From the way you've worded the question, I've assumed the maximum number of answers for a question is fixed. Let's further assume you identify those with the letters A to F, as in your example.
Given your "answer" field accepts multiple responses, its name should include square brackets. We can identify each individual answer as follows:
<input type="text" name="answer[A]" />
We can identify the correct answer by constructing radio buttons of the form:
<input type="radio" name="correct_answer" value="A" />
Calling Input::get('answer') in your controller will return an associative array, where the key is the answer identifier (A to F), and the value is the answer text.
You can use PHP's array_filter function to filter out the empty answers.
$answers = array_filter(Input::get('answer'));

Categories