我面临问题,请参见以下屏幕截图。
在屏幕截图中,您可以看到其图像上传页面。默认情况下,应显示添加图像按钮和显示列表的表格。我要实现的概念是,当我单击添加图像按钮时,表列表应该被隐藏并且必须显示图像上载部分。所有这些都应在同一URL中进行。
下面是代码:
路线:
Route::post('/imageupload', 'Admin\ImageController@imageUploadPost')->name('image.upload.post');
刀片文件:
<div class="panel panel-container">
<button type="button" class="btn btn-primary">Add Image</button>
</div>
<div class="panel panel-container">
<table class="table table-striped" id="slideshow">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">First</th>
<th scope="col">Last</th>
<th scope="col">Handle</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th scope="row">3</th>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
</div>
<div class="panel panel-container hide-img-upload">
<form action="{{ route('image.upload.post') }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="row">
<div class="col-md-6">
<input type="file" name="image" class="form-control">
</div>
<div class="col-md-6">
<button type="submit" class="btn btn-success">Upload</button>
</div>
</div>
</form>
</div>
</div>
控制器:
public function imageUploadPost()
{
return back()
->with('success','You have successfully upload image.')
->with('image',$imageName);
}
由于我是Laravel的新手,所以我看不到解决方案。
任何帮助将不胜感激。
这是有关html和javascript人员的更多信息。您可以将其用作提示。
首先定义文件输入的ID;
尝试一下