所以我有这个编辑表单,我想显示我从创建表单上传的图像(它正在工作)所以当我编辑一个建筑物时,我只想看到我上传的旧图片因为它没有显示表格。编辑工作,但我想看到已上传的图片。我尝试使用“$ building-> picture”但不工作,我的数据库的列名是“picture”。
这是代码
@extends('layouts.main')
@section('title', 'Edit Building')
@section('content')
{!! Form::open(array('route' => ['editbuilding',$id], 'class' => 'form' , 'files'=>'true')) !!}
<div class="container">
<div class="form-group">
{!! Form::label('Building Name') !!}
{!! Form::text('buildingname', $building->name, array('required',
'class'=>'form-control',
'placeholder'=>'Building Name')) !!}
</div>
<div class="form-group">
{!! Form::label('Building Name') !!}
{!! Form::file('buildingpics',
array('onchange'=>'previewFile()')) !!}
<img src="{{asset(''.$building->picture) }}" id="previewImg" style="height:300px; width:300px;" alt="">
</div>
<div class="form-group">
{!! Form::submit('Update',
array('class'=>'btn btn-primary')) !!}
<a href="{{route('index')}}" class="btn btn-default btn-md">Back</a>
</div>
</div>
{!! Form::close() !!}
<script type="text/javascript">
function previewFile() {
var preview = document.querySelector('#previewImg');
var file = document.querySelector('input[type=file]').files[0];
var reader = new FileReader();
reader.addEventListener("load", function () {
preview.src = reader.result;
}, false);
if (file) {
reader.readAsDataURL(file);
}
}
</script>
@endsection
@section('scripts')
@endsection
答案 0 :(得分:0)
您是否将网址存储在picture
文件中的图片中?如果是这样,您只需将该网址传递到src
代码的img
即可。
<img src="{{ $building->picture }}" ... />
答案 1 :(得分:0)
首先选择保存文件的位置。我指的是存储文件的路径。
<img src="{{ url($building->picture) }}" ... />
如果您的文件位于公共文件夹中。
答案 2 :(得分:0)
asset() - 生成应用程序资产的URL。
根据您的文件夹名称更改folder_name的名称(如果有的话)在“assets”文件夹
中 @if ($building->picture)
<img src="{{asset('assets/'.$building->picture)}}">
@else
<p>No image found</p>
@endif