Laravel 5.6 + Jscript日期选择器

时间:2018-08-25 18:36:45

标签: javascript laravel laravel-blade

.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

1 个答案:

答案 0 :(得分:0)

如果您的日期选择器已编译到app.js中,并且依赖于jquery,则需要在放置后将其加载

=IF(P4<>0,RANDBETWEEN(1,100),P4)

bootstrap.min.js之后。