Flatpickr creates additional input field - laravel

I'm implementing a project in laravel. There is a view with some input fields. One of them should be viewed with flatpickr. Although default options are used, flatpickr adds always an additional input field. I want to use my defined input field with flatpickr.
Generated code:
I tried already to override the default option with altInput: false but this doesn't work at all.
#extends('layouts.app')
#section('content')
<div class="card">
<div class="card-header">
<h3>Buchung {{ isset($booking) ? 'ändern' : 'anlegen' }}</h3>
</div>
<div class="card-body">
<form method="post" action="{{ isset($booking) ? route('bookings.update', $booking->id) : route('bookings.store') }}">
#csrf
#if (isset($booking))
#method('PUT')
#endif
<div class="form-group">
<label for="project">Projekt</label>
<select name="project" class="form-control">
#foreach ($projects as $project)
<option value="{{ $project->id }}">{{ $project->name }}</option>
#endforeach
</select>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label for="date">Datum</label>
<input type="text" id="date" name="date" class="form-control">
</div>
...
#endsection
#section('scripts')
<script>
flatpickr('#date');
</script>
#endsection

I had a similar problem, flatpickr was creating a new input field - hidden, it did not create a new input field visible in the browser - because altInput: was set to true. I am not sure if you can set it to false without compromising what you want to achieve, but maybe this leads you in the right direction to fix it?

Related

Cannot find errors returned by validate method

I am using the validate method to validate user input and when I post a form with errors, I get redirected to the previous page but the form is not repopulated and the errors are not showing. I have include a partial view for showing errors in the page with the form. The partial view is:
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors as $error)
<li> {{ $error }} </li>
#endforeach
</ul>
</div>
#endif
the action method in the controller is:
public function store(Request $request)
{
$request->validate([
'product_name' => 'required',
'age' => 'required',
'product_code' => 'required|alpha_num',
'price' => 'required|numeric',
]);
$product=new Product();
The view with the form is:
#section('content')
<div class="container">
#include('partials.errors')
<form action="/products/create" method="POST">
<input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
#csrf
<div class="form-group">
<label>Product Name</label>
<input name="product_name" type="text" class="form-control">
</div>
<div class="form-group">
<label>Age</label>
<input name="age" type="text" class="form-control">
</div>
<div class="form-group">
<label>Gender</label>
<select class="form-control" name="gender">
<option>
Male
</option>
<option>
Female
</option>
Unisex
</option>
</select>
</div>
<div class="form-group">
<label>Product Code</label>
<input name="product_code" type="text" class="form-control">
</div>
<div class="form-group">
<label>Price</label>
<input name="price" type="text" class="form-control">
</div>
<div class="form-group">
<label>Product Category</label>
<select class="form-control" name="category_name">
#foreach ($product_categories as $product_category)
<option>{{ $product_category->category_name }}</option>
#endforeach
</select>
</div>
<div class="form-group">
<label>Brand</label>
<select class="form-control" name="brand_name">
#foreach ($brands as $brand)
<option>{{ $brand->brand_name }}</option>
#endforeach
</select>
</div>
<button class="btn btn-primary" type="submit">Create</button>
</form>
</div>
#endsection
when I post a failed form, I get redirected to the view with the form but the form is not repopulated with the input that I entered. additionally, the erros are not shown but just an empty red div. According to a book I read, if the data isn’t valid, the validate method throws a ValidationException and the exception will return a redirect to the previous page, together with all of the user input and the validation errors. I am new to laravel.
You should use old() method to keep repopulate entered value in input field like below
<input name="product_code" type="text" class="form-control" value="{{ old('product_code') }}">
To show validation error you have to add errors in each field for example like below
#error("product_code")
<div class="invalid-feedback">{{ $message }}</div>
#enderror
You can read more about old method here
https://laravel.com/docs/8.x/requests#retrieving-old-input
For validation error
https://laravel.com/docs/8.x/validation#the-at-error-directive
First, the CSRF token:
If you check the docs you'll see that you have 2 options how to add it:
#csrf
<!-- Equivalent to... -->
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
You are doing both, remove one of them.
Second, the old input:
You are missing the old input call. For example:
<input name="product_code" type="text" class="form-control" value="{{ old('product_code') }}">
Last, the errors:
You are doing it correctly.
If is still not working, check that your route is using the middleware web.

The PATCH method is not supported for this route. when second form is submitted

I've been working on a CMS system for a website im building and it all went good untill I added 2 forms on the same page (both updating different things) and yet it still gives me the error in the title while the other form works fine?
The page banner is the one which returns the error and the 'normal' update works fine!
Web.php
Route::patch('/beheer/paginas/{product}', 'PageController#update')->middleware('auth')->name('beheer.pages.update');
Route::patch('/beheer/paginas/update-banner/{product}', 'PageController#update-banner')->middleware('auth')->name('beheer.pages.banner.update');
Also shows in php artisan route:list that it's a PATCH method route.
My view:
#extends('layouts.beheer')
#section('content')
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-md-6">
<div class="card">
<div class="card-header">
<div class="d-inline card-title">Pagina bewerken</div>
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
</div>
<div class="card-body">
<form action="{{ route('beheer.pages.update', $page->id) }}" method="POST" enctype="multipart/form-data">
#csrf
{{ method_field('PATCH') }}
<div class="form-group">
<label>Zichtbaarheid:</label>
<select class="custom-select" name="page_hidden">
<option value="0" #if (!$page->page_hidden) selected #endif>Zichtbaar</option>
<option value="1" #if ($page->page_hidden) selected #endif>Verborgen</option>
</select>
</div>
<div class="form-group">
<label>Pagina naam:</label>
<input type="text" name="page_name" value="{{ $page->page_name ? $page->page_name : old('page_name') }}" class="form-control" placeholder="Pagina naam">
</div>
<div class="form-group">
<label>Pagina tekst:</label>
<textarea name="page_text" class="form-control">{{ $page->page_text ? $page->page_text : old('page_meta_title') }}</textarea>
</div>
<div class="form-group">
<label>Pagina title SEO:</label>
<input type="text" name="page_meta_title" value="{{ $page->page_meta_title ? $page->page_meta_title : old('page_meta_title') }}" class="form-control" placeholder="Pagina titel SEO">
</div>
<div class="form-group">
<label>Pagina beschijving SEO:</label>
<input type="text" name="page_meta_description" value="{{ $page->page_meta_description ? $page->page_meta_description : old('page_meta_description') }}" class="form-control" placeholder="Pagina beschijving SEO">
</div>
<button type="submit" class="btn btn-primary float-right">Opslaan</button>
</form>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-header">
<div class="d-inline card-title">Banner</div>
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
</div>
<div class="card-body">
<form onsubmit="{{ route('beheer.pages.banner.update', $page->id) }}" method="POST" enctype="multipart/form-data">
#csrf
{{ method_field('PATCH') }}
<input type="hidden" name="image_section_banner" value="1">
<input type="hidden" name="page_id" value="{{ $page->id }}">
<div class="form-group">
<img src="{{ asset($page_banner ? $page_banner->image_large_url : asset('assets/img/banner-home.jpg')) }}" class="img-fluid" style="max-height:250px;">
</div>
<div class="form-group">
<label>Afbeelding:</label>
<input type="file" name="image" value="{{ old('image') }}" class="form-control">
</div>
<button type="submit" class="btn btn-primary float-right">Opslaan</button>
</form>
</div>
</div>
</div>
</div>
</div>
#endsection
If there is any additional information needed please let me know!
There is an attribute missing on your 2nd <form>. Here is what you have:
<form onsubmit="{{ route('beheer.pages.banner.update', $page->id) }}" ...>
But it should look like this:
<form action="{{ route('beheer.pages.banner.update', $page->id) }}" ...>
Since you did not specify an action attribute, it is submitting to the current url which probably doesn't have a patch route defined.

Update single field in a Profile Update Form in Laravel 5

I am trying to update a single field in my user profile form section in the Laravel app.
I can save fields correctly in DB but input values and placeholders are taking wrong values. In every hit Save, the values doesn' change, and they are taken from the last listed user profile details. In my case this is user#3. The problem is when I log in with the user's #1 credentials, value and placeholder are taken from user #3. When I log in with user #2, again from user #3. Only values of user#3 are correct and I can manipulate it with no issues for both fields.
When i update the profile fields with user#1 it saves the entered one filed, but because the 2nd filed inherits the user#3 input details it saves it in field 2 of user#1 which makes a wrong entry. I can't leave null in those fields by default. My mass assignment is guarded.
How can save/update just a single field in the blade template without affecting the other fields in the form?
My routes:
Route::get( '/profile', 'userController\\profileEdit#profileEdit')->name('profileEdit');
Route::post('/profile', 'userController\\profileEdit#update')->name('update');
My controller:
namespace App\Http\Controllers\userController;
use App\Model\Hause_users;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
class profileEdit extends Controller
{
function profileEdit (Request $request){
$user = Hause_users::all();
$name = $request->session()->get('name');
$request->session()->keep([request('username', 'email')]);
return view('frontview.layouts.profile',['user'=>$user])->with('username' , $name );
}
function update (Request $request){
$user = Hause_users::where('username', $request->session()->get('name'))->first();
$user->fill(['email' => request('Email')]) ;
$user->save();
$user->phone;
//dd($user->phone->phone);
if ($user->phone === null) {
$user->phone->phone->create(['phone' => request('tel')]);
}
else{
$user->phone->update(['phone' => request('tel')]);
}
return back()->withInput();
}
Blade file: `
#extends('frontview.layouts.userView')
#extends('frontview.layouts.default')
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
#section('title')
#endsection
#section('content')
#foreach($user as $v )
#endforeach
<h2 class="form-group col-md-6">Здравей, {{$username }} </h2>
<form class = "pb2" method="POST" name = 'profile' action='profile' >
{{ csrf_field()}}
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">Поща</label>
<input type="email" class="form-control" name = "Email" id="inputEmail4"
value="{{$v['Email']}}"
placeholder="{{$v->Email}}">
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">Промени Парола</label>
<input type="password" class="form-control" id="inputPassword4" placeholder="Парола">
</div>
</div>
<div class="form-group">
<label for="inputAddress">Address</label>
<input type="text" class="form-control" name = "Adress" id="inputAddress" placeholder="Снежанка 2">
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputAddress">Телефон</label>
<input class="form-control" type="text" name = 'tel' value="{{$v->phone['phone']}}"
placeholder="{{$v->phone['phone']}}"
id="example-tel-input" >
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputCity">Град</label><input type="text" class="form-control" id="inputCity">
<label for="inputCity">Квартал</label><input type="text" class="form-control" id="inputCity">
</div>
{{--<div class="col-md-6" >--}}
{{--<label for="image">Качи снимка</label>--}}
{{--<input type="file" name = "image">--}}
{{--<div>{{$errors->first('image') }}</div>--}}
{{--</div>--}}
</div>
{{--<div ><img src="https://mdbootstrap.com/img/Photos/Others/placeholder-avatar.jpg"--}}
{{--class="rounded-circle z-depth-1-half avatar-pic" alt="example placeholder avatar">--}}
{{--</div>--}}
{{--<div class="d-flex justify-content-center">--}}
{{--<div class="btn btn-mdb-color btn-rounded float-left">--}}
{{--<span>Add photo</span>--}}
{{--<input type="file">--}}
{{--</div>--}}
{{--</div>--}}
{{--</div>--}}
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="gridCheck">
<label class="form-check-label" for="gridCheck">
Запомни ме!
</label>
</div>
</div>
<button type="submit" class="btn btn-primary">Запази</button>
</form>
#endsection
#section('name')
{{ $username }}
#endsection
Output summary:
On img#1 are the correct entry details . This is other section not the Profile edit one. Currently loged user is U#1 but as you can see on image 2, values and placeholder of both fields are for the U#3. When i hit the blue button U#1 saves the untouched filed input of U#3. Same is when i log in with U#2.
Actually the answer here is quite simple. What i am doing wrong is that i am not passing the value of the currently logged user to the view correctly. On my profileEdit method i was using $user = Hause_users::all(); and then looping trough all id's into the view and then fetching every field. But because the view doesn know which user passes the data, the foreach always returns the last user id from the array with its input, no matter which user is currently logged in. Then the data was overridden with wrong inputs.
The solution is also simple.
Instead of $user = Hause_users::all();
i have used
$user = Hause_users::where('username', $request->session()->get('name'))->first();
and then into view i was objecting the $user variable without any loops like this:
<form class = "pb2" method="POST" name = 'profile' action='profile' >
<input type="hidden" name="_token" value="{{ csrf_token() }}">
{{--<input type="hidden" name="_method" value="PATCH">--}}
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">Поща</label>
<input type="Email" class="form-control" name = "Email" id="inputEmail4"
value="{{$user->Email}}"
placeholder="{{$user->Email}}">
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">Промени Парола</label>
<input type="password" class="form-control" id="inputPassword4" placeholder="Парола">
</div>
</div>
<div class="form-group">
<label for="inputAddress">Address</label>
<input type="text" class="form-control" name = "Adress" id="inputAddress" placeholder="Снежанка 2">
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputAddress">Телефон</label>
<input class="form-control" type="text" name = 'tel' value="{{$user->phone['phone']}}"
placeholder="{{$user->phone['phone']}}"
id="example-tel-input" >
Basically this is a detailed explanation to all that not using the built in Auth system of Laravel

laravel post from view does not call controller method

I am trying to send a post request from my view but somehow this request is not passing to my controller method while other controller methods are working..
my routes:
Route::get('/executes', 'ExecuteController#index')->name('execute.index');
Route::post('/executes', 'ExecuteController#store')->name('execute.store');
Route::get('/executes/create', 'ExecuteController#create')->name('execute.create');
my view:
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-6">
<h2>Create Execute</h2>
<form method="post" action="/executes" enctype="multipart/form-data" class="pt-4">
#csrf
<div class="form-group">
<input type="text" class="form-control" id="name" name="name" placeholder="Name">
#error('name')
<p class="pt-3 text-danger">
{{ $message }}
</p>
#enderror
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
<label class="input-group-text" for="map">Map</label>
</div>
<select class="custom-select" id="map" name="map">
<option selected>Choose...</option>
#foreach($maps as $map)
<option value="{{ $map->id }}">{{ $map->name }}</option>
#endforeach
</select>
#error('map')
<p class="pt-3 text-danger">
{{ $message }}
</p>
#enderror
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
#endsection
my controller:
class ExecuteController extends Controller
{
public function create()
{
return view('execute/create', ['maps' => Map::all()]);
}
public function store()
{
// is not even getting here
dd('test');
}
}
any ideas why my method is not getting called?
Could you try to change this
FROM
action="/executes"
TO
action="{{route('/executes')}}"
OR
action="{{url('/executes')}}"
Hope it helps
You're using named routes, so refer to their names when building a URL instead.
Example:
action={{url('execute.store')}}
Please use {{ url('ROUTE_NAME')}} in action or where you want to give link
Use route in the form action as following
action="{{route('execute.store')}}"
guys thank you for your replies but the problem was on the frontend, I had a js included outside the html tag in my layout, somehow that messed up my store method, by fixing that it now works

view new div based on option value of select tag using laravel

i have a dropdown list when i select any one option from list i should display an another form with name of the teacher and subject of the teacher in textbox.The form is not displaying.when i select one item it should display the selected name and description box to add subjects of teachers that they interested please help me
view page
<div class="portlet light bordered row">
<h1>Add teacher subject</h1>
<div class="row">
<form action = "{{ url('subjectby/adding/process') }}" method = "POST">
{{ csrf_field() }}
<div class= "col-md-12">
<div class="form-group">
<h3>Choose Teachers </h3>
<div class="input-group">
<div class="ui-widget border-dropdown" style="margin-left:50px;">
<select id="teacher" name="teachers" placeholder="Select Teacher">
<option value="">Select Teacher</option>
#foreach($user as $tec)
<option value="{{$tec->id}}">{{$tec->name}}</option>
#endforeach
</select>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="new">
<div class="form-group">
<div class="col-sm-6">
<label for="inputFacebook">Teacher Name</label>
<input type=hidden value="{{$tec->id}}" name="id">
<input type="text" value="{{$tec->name}}" class="form-control" name="name">
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<label for="inputDescription">Subject Interested</label>
<textarea class="form-control" rows="8" name="intr" placeholder="Enter Subject Interest"> </textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="submit" value="add" name=b1>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
This isn't a Laravel specific problem. You are taking about DOM manipulation and so you best bet is to use jQuery or Vuejs or even vanilla Javascript if you so choose. Basically, you will write a script to watch for when your <select> changes, and then based on it's new value, show the part of the form you want.
Keep in mind that Laravel is a backend framework and so the user will never interact with it on a page. After a page loads, Laravel has done all it can do until another request is made. This is why Javascript was born - to let the user change things without reloading the page.

Resources