javascript - Laravel 5.6 + Jscript 日期选择器
问题描述
我在 .blade 视图中有一个小问题,即使警报触发器有效,我似乎也无法加载 JS 选择器。
页面预览:
@extends('layouts.app')
@section('title', '| Create New Event')
@section('content')
<?php use App\Product; ?>
<div class="container">
<div class="row border">
<div class="col-6">
<h4>Create a New Event</h4>
</div>
</div>
{{ Form::open(array('route' => 'events.store')) }}
<div class="row">
<div class="col-2 form-group">
{{ Form::label('product_id', 'Product') }}
{{ Form::select('product_id', Product::pluck('item', 'id'), null, ['placeholder' => 'Choose Product...',
'class' => 'form-control',
])}}
</div>
<div class="col-2 form-group">
{{ Form::label('pot', 'Pot') }}
{{ Form::text('pot', null, ['placeholder' => 'Pot',
'class' => 'form-control',
])}}
</div>
</div>
<div class="row">
<div class="col-4 form-group">
{{ Form::label('rundate', 'Event Date') }}
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
<div class="col-2">
visible at picker here
</div>
</div>
<div class="row">
<div class="col-3">
textarea
</div>
<div class="col-1">
button
</div>
</div>
</div>
@stop
@section('javascript')
@parent
<script>
alert('test');
$(function () {
$('#datetimepicker2').datetimepicker({
locale: 'en'
});
});
</script>
@stop
这是我的 layouts.app 的 section('javascript') 部分,javascript 已加载并且警报有效,但 datepicker 没有,与输入文本关联的按钮不执行任何操作
@section('javascript')
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js">
</script>
@show
解决方案
如果你的 datepicker 被编译成 app.js 并且依赖于 jquery 你需要在 so put 之后加载它
<script src="{{ asset('js/app.js') }}"></script>
在 bootstrap.min.js 之后。
推荐阅读
- mongoose - 有没有办法从另一个模式(如猫鼬)填充 Joi 中的模式?
- hyperledger-fabric - 服务发现说拒绝访问
- google-cloud-platform - Google cloud + bitnami + FTP 如何在我的 GC 上找到文件
- vb.net - 我必须使用哪个命令来清除 VB 中 PrintPreview 中的文本?
- linux - docker build 在 Ubuntu 16.04 上运行命令失败,但在 18.04 上没有相同的 Docker 版本
- javascript - 删除 Zurb Foundation 内联样式
- android - 带有 ActionCodeSettings 的 sendEmailVerification() 不发送电子邮件
- swift - 右键单击 NSTableView 行时如何添加(显示)上下文菜单?
- php - 嗨,我想通过输入类型文件传递表单数据,但我该怎么做?
- php - 查看 [partials.header] 未找到。(查看:W:\domains\iten\resources\views\layouts\master.blade.php)