I am doing an image upload. The image successfully uploads but when press the button the image will missing.
This is my interface for image upload
when I select the image
the default image will change to the image I select
ut after I press the upload button to the backend it works but the selected image will become back the default one. Does anyone know how to solve it? Thanks in advance
Here is my code:
<form method="POST" action="url" enctype="multipart/form-data" id="upload">
#csrf
<div class="d-flex mb-2 ms-1 justify-content-md-center">
<img src="{{ asset('assets/images/placeholder.png') }}"/>
</div>
<label class="btn me-75 mb-0" for="picture">
<span class="d-none d-sm-block">Upload</span>
<input class="form-control" type="file" name="image" id="change" accept="image/*" hidden required/>
</label>
</form>
Related
I have a form that contains an email input and a submit button. On Iphone, when I type something on email and delete it, button slide down a little bit. I use tailwind css and what causes this problem?
<form wire:submit.prevent="submit">
<span class="inline-grid">
<input type="text" name="email" wire:model.defer="email" class="form-control relative flex-auto desktop:rounded-lg below-desktop:rounded placeholder-gray-300 desktop:h-14 below-desktop:h-8 xl:w-72 small-desktop:w-60" placeholder="{{__('E-mail')}}" aria-label="Search" aria-describedby="button-addon2" style="border-radius: 4px;">
</span>
<button type="submit" class="bg-blue-400 text-base desktop:rounded-lg below-desktop:rounded text-white desktop:h-14 below-desktop:h-8 px-6 desktop:ml-2 xl:w-32 small-desktop:w-24" style="border-radius: 4px;">{{ __('Send') }}</button>
</form>
I am creating multiple steps form with livewire. In the third step, I am uploading the image via livewire and also previewing the image on the image selected.
After previewing the image, when I move to the first or second step it returns the error - [Serialization of 'Livewire\TemporaryUploadedFile' is not allowed]
Please help me, with how I can solve this issue.
<div class="form-row pl-2 pr-2 reward-engagement mt-3">
<div class="col-md-9 mb-3">
<label for="validationDefault01"><small>UPLOAD IMAGE</small></label>
<div class="input-group input-group-merge">
<input type="file" class="form-control form-control-sm " id="amount5" wire:model="photo" />
</div>
</div>
<div class="col-md-3 mt-4 mb-2 pt-1">
<button type="button" class="btn btn-sm btn-success btn-icon" wire:click="mission_description"> <span>Continue</span> </button>
</div>
</div>
<div wire:loading wire:target="photo">Uploading...</div>
#if($photo)
<img src="{{ $isUploaded ? $photo->temporaryUrl() : asset('public/'.$photo) }}" width="150" height="150">
#endif
ScreenShot:
Front View Screenshot
It is a temp file and Livewire can't serialize it on subsequent requests. You have to store the file
https://laravel-livewire.com/screencasts/s5-intro
Do you by any chance have multiple components for each step?
Here how to use it according to its GitHub
I already install the package:
Use Opengraph
$data = OpenGraph::fetch("http://www.addemyplus.com/blogs/my-faith-for-your-love");
that may return an array:
{"type":"website","title":"My Faith For Your Love","description":"","image":"http:\/\/www.addemyplus.com\/images\/frontend_images\/blogs\/medium\/57670.jpg"}
My problem is how can I use it on my blade that whenever I type a link in the form it will fetch the Og data of that site.
and show below the image and description
I have this code on form:
<form action="{{route('store_post_path')}}" method="POST">
{{csrf_field()}}
<div class="form-group">
<label class="sr-only" for="title">title</label>
<input type="text" class="form-control" name="title" placeholder="Your Post Title or Question">
</div>
<div class="form-group">
<label class="sr-only" for="post">post</label>
<textarea class="form-control" name="post_content" id="post_content" rows="3" placeholder="Briefly explain your question or Your Post Content"></textarea>
</div>
<div class="tab-pane fade" id="images" role="tabpanel" aria-labelledby="images-tab">
<div class="form-group">
<div class="custom-file">
</div>
</div>
<div class="py-4"></div>
</div>
<div class="btn-toolbar justify-content-between">
<div class="btn-group">
<button type="Submit" class="btn btn-primary">Share your Post</button>
</div>
</div>
</form>
How can I use the code to fetch the Og property of the link? I want to view the image and title of the link below before submitting my post.. Please show some tutorial sites for this.
Get the link from the form in post content. You can do it using regex.
function getUrl($string)
{
$regex = '/https?\:\/\/[^\" ]+/i';
preg_match_all($regex, $string, $match);
return ($match);
}
$url = getUrl($string)
If there are any links in post content you will get array of links.
Use OpenGraph::fetch($url) to fetch the OG data of the url. That you can show in the view.
i want to display the image from the database in dropzone.
here is my view page :
<div class="col-md-6"> <b>Challenge Banner</b>
<form class="dropzone dz-clickable" id="#" action="<?php echo base_url(''); ?>Challenge/file_upload" enctype="" method="post">
<div class="dz-message text-center" style='height:80px;'>
<div class="drag-icon-cph"> <i class="material-icons" style='font-size:36px;'>touch_app</i>
</div>
<h6>Drop files here or click to upload.</h6>
</div>
</form>
</div>
i want to display image from data base.. how i can upload the image?
I am trying to edit existing post using CKeditor. Content isn't loading.
<div class="form-group">
<label>Content</label>
<textarea id="editor1" name="content" class="form-control" rows="3" placeholder="Enter ...">
{{ Request::old('content') }}
</textarea>
</div>
Also im having trouble getting date from the database too.
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<input type="date" name="published_at" class="form-control" value="{{ $post->published_at->format('M jS Y') }}">
</div>
For the textarea, check for old input, but fall back to defaulting to using the model's content attribute (the post's content)
<textarea ....>{!! Request::old('content', $post->content) !!}</textarea>
For your date issue, I don't know what problem you are having.