I want to preload an image from my laravel project . from "public/storage/uploads/users" to my file input feild so that the user wont have to pick an image again if he/she dont need to update the image feild . I used url(0 and asset() to specify the url in the "value=" feild but its not working please help.
Below is my code i wrote but its not working
<div class="form-group">
<label class="control-label">Image <span class="text-danger"> *</span></label>
<input type="file" class="form-control #if ($errors->has('image')) is-invalid #endif" name="image" value="{{url('storage/' . $user->image)}}"
placeholder="Enter Image" required>
<img src="{{ asset('storage/' . $user->image) }}" class="img-thumbnail mt-2" width="100" alt="">
<div class="invalid-feedback">{{ $errors->first('image') }}</div>
</div>
Related
im trying to download file using Laravel download response. The problem is probably the route is missing or went wrong, and it shows 404 Error Not Found. I'm using symlink on my storage file so it can be seen in public and it stores my files also.
Blade :
<div class="mb-3">
<label for="lampiran" class="form-label">Lampiran</label>
<div class="input-group mb-3">
<input type="text" class="form-control #error('lampiran') is-invalid #enderror"
value="{{ $dokumentasi->lampiran }}" readonly>
{{-- <span class="input-group-text"><i class="fa fa-download" aria-hidden="true"></i></span> --}}
<span class="input-group-text"><i class="fa fa-download" aria-hidden="true"></i></span>
</div>
</div>
Controller :
public function download($file_name)
{
$file_path = base_path($file_name);
return response()->download($file_path);
}
Route / web.php :
Route::get('/lampiran-nde/{file}', 'download')->name('history.download');
This question already has answers here:
laravel 5.4 upload image
(12 answers)
Reference - What does this error mean in PHP?
(38 answers)
Closed 2 years ago.
I am stuck trying to store an image of a product in the database. My database is currently just storing the name of the image, like chicken.jpeg. Not really a chicken by the way hahaha. So the current output is the filename of the image is stored in the database. However the desired result should be the whole image is stored in the database, that way after the image is uploaded through the form, there would be no need for the user to keep the image on their computer anymore. I have some code below if you feel interested to help me.
This is my ProductController#store:
public function store(Request $request)
{
$data = request()->validate([
'productName' => 'required',
'productImage' => 'required',
'productLink' => 'required',
'productPrice' => 'required',
'productDescription' => 'required',
]);
$product = new Product([
'productName' => $request->get('productName'),
'productImage' => $request->get('productImage'),
'productLink' => $request->get('productLink'),
'productPrice' => $request->get('productPrice'),
'productDescription' => $request->get('productDescription'),
]);
$product->save();
return redirect('/pr');
}
This is my form:
<form action="/storeProduct" method="post">
#csrf
<label for="productName">Product Name:</label><br>
<input type="text" id="productName" name="productName" autocomplete="off" value="{{
old('productName') }}"><br>
#error('productName') <p style="color: red">{{ $message }}</p> #enderror
<label for="productImage">Product Image:</label><br>
<input type="file" id="productImage" name="productImage" autocomplete="off" value="{{
old('productImage') }}"><br>
#error('productImage') <p style="color: red">{{ $message }}</p> #enderror
<label for="productLink">Product Link:</label><br>
<input type="text" id="productLink" name="productLink" autocomplete="off" value="{{
old('productLink') }}"><br>
#error('productLink') <p style="color: red">{{ $message }}</p> #enderror
<label for="productPrice">Product Price:</label><br>
<input type="decimal" id="productPrice" name="productPrice" autocomplete="off" value="{{
old('productPrice') }}"><br>
#error('productPrice') <p style="color: red">{{ $message }}</p> #enderror
<label for="productDescription">Product Description:</label><br>
<input type="text" id="productDescription" name="productDescription" autocomplete="off" value="
{{ old('productDescription') }}"><br>
#error('productDescription') <p style="color: red">{{ $message }}</p> #enderror
<input type="submit" value="Submit">
</form>
Thanks for taking the time to read my question and attempting to help me. I have attached my GitHub repository below, if you are interested in reading through my code.
https://github.com/xiaoheixi/blog
For uploading image through form you need to set enctype in your form first
and also instead of uploading an image into database you should upload it to your public image folder it will be far better and store only name of image into your database
changes in form:
<form enctype='multipart/form-data' action="/storeProduct" method="post">
#csrf
<label for="productName">Product Name:</label><br>
<input type="text" id="productName" name="productName" autocomplete="off" value="{{
old('productName') }}"><br>
#error('productName') <p style="color: red">{{ $message }}</p> #enderror
<label for="productImage">Product Image:</label><br>
<input type="file" id="productImage" name="productImage" autocomplete="off" value="{{
old('productImage') }}"><br>
#error('productImage') <p style="color: red">{{ $message }}</p> #enderror
<label for="productLink">Product Link:</label><br>
<input type="text" id="productLink" name="productLink" autocomplete="off" value="{{
old('productLink') }}"><br>
#error('productLink') <p style="color: red">{{ $message }}</p> #enderror
<label for="productPrice">Product Price:</label><br>
<input type="decimal" id="productPrice" name="productPrice" autocomplete="off" value="{{
old('productPrice') }}"><br>
#error('productPrice') <p style="color: red">{{ $message }}</p> #enderror
<label for="productDescription">Product Description:</label><br>
<input type="text" id="productDescription" name="productDescription" autocomplete="off" value="
{{ old('productDescription') }}"><br>
#error('productDescription') <p style="color: red">{{ $message }}</p> #enderror
<input type="submit" value="Submit">
</form>
and for uploading an image you can use
if ($request->hasFile('productImage')) {
$image = $request->file('productImage');
$name = time().'.'.$image->getClientOriginalExtension();
$destinationPath = public_path('/images');
$image->move($destinationPath, $name);
}
for file upload reference read this answer Laravel Image upload
I want to show "€" before the "participant" value with Jquery.
Html input
<div class="form-group">
<label>Participant</label>
<input type="text" name="participant" id="participant" class="form-control participant" value="{{ $distance_price }}" readonly>
</div>
I have tried using the before() function but that caused the NaN error in the other input value, because I use the $distance_price in a calculation.
Any help would be much appreciated!
You can add this as an input group addon & then use Jquery to change the symbol if required
https://getbootstrap.com/docs/4.0/components/input-group/
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="currency_symbol">£</span>
</div>
<input type="text" name="participant" id="participant" class="form-control participant" value="{{ $distance_price }}" readonly>
</div>
<script>
$('#currency_symbol').html('€')
</script>
You can try this with jquery
$('#participant').change(function () {
$('#participant').val('€' + $(this).val());
});
Also Try In Your Laravel Controller
$input = $request->all();
$input['participant'] = '€' . $input['participant'];
Just take a look at the documentation of bootstrap, maybe it gives you a direction.
https://getbootstrap.com/docs/4.3/components/input-group/
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">€</span>
</div>
<input type="text" name="participant" id="participant" class="form-control participant" value="{{ $distance_price }}" readonly>
</div>
I'm trying to resize a form box using .col-md-12. It works fine if I keep the code inside the span tag as it is, but if I take it off (and I want to, because I need to remove that button) it stops working. In this scenario the form box will maintain some kind of default size, no matter which value is inserted after -md.
Could anyone give some help? If it matters, this HTML file is part of the viewer of a project using laravel framework.
<div class="box-body">
<div class="col-md-12">
<div class="form-group">
<label for="name">{{ 'name' }}</label>
<div class="input-group">
<input class="form-control" type="text" name="name" value="{{ $name }}">
<span class="input-group-btn">
<a class="btn btn-warning" href="{{ url('path', $id) }}" title="{{ 'edit' }}"><i class="fa fa-pencil"></i></a>
</span>
</div>
</div>
</div>
</div>
Provided that I understood your question right, just add the btn class to the span tag and remove the a tag.
<span class="input-group-btn btn">
<!-- removed button -->
</span>
i have a project based on codeignitor , im facing a problem with uploading forms i cant attach more than one files i have an upload fields to attach user profile picture im trying to duplacate the filed to attach two or more files with no chance .
note i do all the changes in MVC files to the dublicated fields .
Here is the field code
<?php
if(isset($image))
echo "<div class='form-group has-error' >";
else
echo "<div class='form-group' >";
?>
<label for="qr" class="col-sm-2 control-label col-xs-8 col-md-2">
<?=$this->lang->line("student_passport_pic")?>
</label>
<div class="col-sm-4 col-xs-6 col-md-4">
<input class="form-control" id="uploadFile" placeholder="Choose File" disabled />
</div>
<div class="col-sm-2 col-xs-6 col-md-2">
<div class="fileUpload btn btn-success form-control">
<span class="fa fa-repeat"></span>
<span><?=$this->lang->line("upload")?></span>
<input id="uploadBtn" type="file" class="upload" name="image" />
</div>
</div>
<span class="col-sm-4 control-label col-xs-6 col-md-4">
<?php if(isset($image)) echo $image; ?>
</span>
</div>
please advice i need to upload too many files .
If you want multiple images from the same field. Make the input field name as an array.
For Ex : The first upload field should be like below
<input id="uploadBtn" type="file" class="upload" name="image[]"/>
Then, the input field which you are generating should also be of the same name
<input id="uploadBtn" type="file" class="upload" name="image[]"/>
and then in the controller where you are taking the POST value, you can take the values of the field using the $this->input->post('image') which will give you all the image names.