我有以下复选框:
<!-- Choose betweeen Upload a video and Insert a video link -->
<div class="row mb-3">
<label class="control-label">Link video</label>
<input type="checkbox" name="link_video"
value="0"
class="switch checkbox-action"
/>
</div>
默认值为false,也就是我希望允许用户上传一个视频,也就是我希望有以下代码:
<!-- Upload a video -->
<div class="row">
<div class="col-md-12 mb-3">
<p>
Put the video here
</p>
{!! Form::hidden('temp_video_filename') !!}
<input-dropzone
name="video-dropzone"
label="Dropzone"
url="/admin/object/upload-video"
:config="{
clickable:true,
chunking:true,
chunkSize: 250000,
parallelUploads: 1,
uploadMultiple: false,
maxFilesize: 1000,
maxFiles: 1,
acceptedFiles: '.mov, .mp4'
}"
@click="initVideoUpload()"
@drop="initVideoUpload()"
@upload="videoUploaded($event)"
/>
</div>
@if($a->video_id)
<div class="col-md-12 uploaded-videos">
<a href="{{ $a->getDirectPlayUrl() }}" target="_blank" class="btn btn-primary download">
<i class="fa fa-play"></i> View video
</a>
<button class="btn btn-danger btn-rounded btn-delete remove" data-record="File" data-url="{{ $a->getAdminVideoRemoveApiUrl() }}" data-callback-function="A.removedAdminVideo">
<icon-delete color="var(--on-error)"></icon-delete> Remove file
</button>
</div>
@endif
</div>
但是,如果用户单击复选框,即该值为true,则会显示以下字段:
<!-- Insert video link -->
<div class="row mb-3">
<div class="col-md-6">
{!! Form::field('video_embed_url', ['label' => __('labels.link_video')]) !!}
</div>
<!-- Force next columns to break to new line -->
<div class="w-100"></div>
<div class="col-md-6">
{!! Form::label(__('labels.preview')) !!}
</div>
</div>
1条答案
按热度按时间e4yzc0pl1#
如果要额外显示,可以使用jQuery和onClick事件。试试下面的代码:
对于field:
如果您正在使用Bootstrap,请参阅:Collapse