Я хочу включить в свое представление некоторый код javascript, но понятия не имею, как это сделать. Я безуспешно искал это, нет четких указаний на это.
Я хочу вставить несколько выбираемых таблиц с помощью начальной загрузки, ссылка находится на https://datatables.net/extensions/select/examples/styling/bootstrap4.html.
javascript это
$(document).ready(function() {
$('#example').DataTable( {
select: true
} );
} );
таблица это
<table id = "example" class = "table table-striped table-bordered" style = "width:100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
...
Говорят, что я должен включить эти библиотеки javascript
https://code.jquery.com/jquery-3.3.1.js
https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js
https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js
https://cdn.datatables.net/select/1.2.7/js/dataTables.select.min.js
Но где мне это делать ?? нет html головы ...
Я попробовал типичный
<script type = "text/javascript">
$(document).ready(function() {
$('#example').DataTable( {
select: true
} );
} );
document.write(5 + 6);
</script>
Как запустить код? Я полагаю, что это делается при загрузке таблицы со ссылкой на #example ...
Хорошо, я попробовал кое-что. Конечно, я не хочу, чтобы вы решали мою проблему, но ничего не помогло. Включаю почти полный код. Он должен работать, как в примере из верхней ссылки. Я не знаю, является ли тот факт, что laravel 5.5 действительно работает с bootstrap 4, а не с включенным, является фактором, на самом деле я не знаю, работает ли он по умолчанию с jquery ...
@extends('layouts.app')
@section('content')
@guest
@else
<nav class = "navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0">
<a class = "navbar-brand col-sm-3 col-md-2 mr-0" href = "#">Venta</a>
</nav>
<div class = "container-fluid">
<div class = "row">
<nav class = "col-md-1 d-block bg-light sidebar">
<div class = "sidebar-sticky">
<h6 class = "sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
<span>Acciones</span>
<a class = "d-flex align-items-center text-muted" href = "#">
<span data-feather = "plus-circle"></span>
</a>
</h6>
<ul class = "nav flex-column">
<li class = "nav-item">
<span data-feather = "home"></span>
<span class = "sr-only"></span>
</li>
<li class = "nav-item">
<a class = "nav-link" href = "/gymmgr/public/notas/{{ $nota->idNota }}/edit">
<span data-feather = "shopping-cart"></span>
Editar
</a>
</li>
<li class = "nav-item">
<a class = "nav-link" href = "#"
onclick = "
var result = confirm ('¿Estas seguro de que deseas borrar el grupo?');
if (result)
{
event.preventDefault();
document.getElementById('delete-form').submit();
}
"
>
<span data-feather = "users"></span>
Borrar
</a>
<form id = "delete-form" action = "{{ route('notas.store')}}"
method = "POST" style = "display: none;">
<input type = "hidden" name = "_method" value = "delete">
{{ csrf_field() }}
</form>
</li>
<li class = "nav-item">
<a class = "nav-link" href = "/gymmgr/public/notas/">
<span data-feather = "users"></span>
Regresar
</a>
</li>
</ul>
</div>
</nav>
<main role = "main" class = "col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
<div class = "d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
<h1 class = "h5">Nota de venta</h1>
<div class = "btn-toolbar mb-2 mb-md-0">
<div class = "btn-group mr-2">
<button class = "btn btn-sm btn-outline-secondary">Exportar</button>
</div>
</div>
</div>
<div class = "border-bottom">
<div class = "col-md-8 order-md-1 ">
<form class = "needs-validation" novalidate>
<div class = "checkbox mb-3">
<label>
<input type = "checkbox" value = "true"> Pagada
</label>
</div>
<div class = "col-md-12">
<label for = "usuario">Usuario</label>
<select class = "custom-select d-block w-100" id = "usuario">
<option value = "">Selecciona...</option>
<option>United States</option>
</select>
<div class = "invalid-feedback">
Please select a valid country.
</div>
</div>
<p>
<div class = "form-group">
<label for = "strNota">Comentarios</label>
<textarea class = "form-control" rows = "3" id = "strNota" name = "text"></textarea>
</div>
</p>
<p>
<hr class = "mb-4">
<button class = "btn btn-primary btn-lg btn-block" type = "submit">Continue to checkout</button>
</p>
</form>
</div>
</div>
</main>
<div class = "container-fluid">
<div class = "row">
<main role = "main" class = "col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
<div class = "d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
<h1 class = "h5">Partidas</h1>
<div class = "btn-toolbar mb-2 mb-md-0">
<div class = "btn-group mr-2">
<button type = "button" class = "btn btn-primary" data-toggle = "modal" data-target = "#create-horario">+</button>
<div class = "modal fade" id = "create-horario" tabindex = "-1" role = "dialog" aria-labelledby = "ModalLabel" >
<div class = "modal-dialog" role = "document">
<div class = "modal-content">
<div class = "modal-header">
<h5 class = "modal-title" id = "ModalLabel">Nueva partida</h5>
<button type = "button" class = "close" data-dismiss = "modal" aria-label = "Close">
<span aria-hidden = "true">×</span>
</button>
</div>
<form action = "{{ route('notas.store') }}" method = "post">
{{ csrf_field() }}
<div class = "modal-body">
<input type = "hidden" id = "groupID" name = "groupID" value= {{ $nota->idNota }} >
<div class = "form-group">
<label for = "intDia" class = "col-form-label">Día de la semana</label>
<select name = "intDia" class = "form-control">
<option value = "1" selected> Lunes</option>
<option value = "2" > Martes</option>
<option value = "3" > Miércoles</option>
<option value = "4" > Jueves</option>
<option value = "5" > Viernes</option>
<option value = "6" > Sábado</option>
<option value = "7" > Domingo</option>
</select>
</div>
<div class = "form-group">
<div style = "width:50%;float:left;display:inline-block;">
<label for = "timHoraInicio" class = "col-form-label">Hora de inicio</label>
<input type = "time" id = "timHoraInicio" name = "timHoraInicio" min = "9:00" max = "18:00" value = "09:00" >
</div>
<div align = "right">
<label for = "timHoraFin" class = "col-form-label">Hora de fin</label>
<input type = "time" id = "timHoraFin" name = "timHoraFin" min = "9:00" max = "18:00" value = "10:00">
</div>
</div>
</div>
<div class = "modal-footer">
<button type = "button" class = "btn btn-default" data-dismiss = "modal">Cerrar</button>
<button type = "submit" class = "btn btn-primary" id = "submitForm">Guardar</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<table id = "example" class = "table table-striped table-bordered" style = "width:100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</main>
</div>
</div>
</div>
</div>
@endguest
@push('scripts')
<script src = "https://code.jquery.com/jquery-3.3.1.js"></script>
<script src = "https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src = "https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script src = "https://cdn.datatables.net/select/1.2.7/js/dataTables.select.min.js"></script>
<script>
//anyjscode
$(document).ready(function() {
$('#example').DataTable( {
select: true
} );
} );
</script>
@endpush
@endsection
Заранее спасибо.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


При этом до конца обзора, но внутри блока сечения. Если ваше представление является автономным файлом, который не расширяет никакие другие представления / макеты, например файл app.blade.php, игнорируйте блок раздела.
@section <!--this block assumes you're extending another file-->
<your-html>
</your-html>
@push('scripts')
<script src = "https://cdn.sample.js"></script>
<script src = "https://cdn.sample.js"></script>
<script src = "https://cdn.sample.js"></script>
<script>
//anyjscode
</script>
@endpush
@endsectionПривет попробуй с Laravel Collective
Как установить? здесь
Импортируйте файл js в файл blade:
{!! HTML::script('js/modulos/comun.js') !!}
И в вашем файле js напишите что-нибудь еще, например:
file.js
$(document).ready(function() {
$('#example').DataTable( {
select: true
} );
} );
Я думаю, вы можете добиться того, что вам нужно, включив отдельный yield () в свой файл шаблона в нижней части тега body:
@yield('scripts')
На ваш взгляд, Blade попробуйте добавить:
@section('content')
Your Content goes here…
@endsection
@section('scripts')
<script type = "text/javascript">
<script src = "https://cdn.sample.js"></script>
<script>
//anyjscode
</script>
@endsection
Вы видите файл blade.php?