javascript — jQuery Ajax — все еще перезагружает страницу — нумерация страниц Laravel

jQuery Ajax — все еще перезагружаю страницу — нумерация страниц Laravel

У меня проблема с пагинацией в Laravel и Ajax. Мой Ajax все еще перезагружает страницу, и я не знаю, почему и как это исправить? Я хочу избежать перезагрузки страницы.

ПОСЛЕДНЕЕ РЕДАКТИРОВАНИЕ: с этим Ajax я получил ошибку: Unable to preventDefault inside passive event listener due to target being treated as passive . Я исправил это с помощью document.addEventListener("mousewheel", this.mousewheel.bind(this), { passive: false }); , но сейчас моя страница перезагружается.

Вот мой взгляд:

 {amp}lt;div id="initiated" class="profile-edit tab-pane fade" style="background: none repeat scroll 0 0;"{amp}gt; {amp}lt;dl class="dl-horizontal"{amp}gt; {amp}lt;ul class="nav justify-content-center u-nav-v5-3 u-nav-primary " role="tablist" data-target="nav-5-3-primary-hor-center" data-tabs-mobile-type="slide-up-down" data-btn-classes="btn btn-md btn-block u-btn-outline-primary" style="display: flex;justify-content: flex-end;"{amp}gt; {amp}lt;li class="nav-item active"{amp}gt; {amp}lt;aa data-toggle="tab" href="#grid" style="font-size: 12px"{amp}gt;{amp}lt;i class="fa fa-th-large"{amp}gt;{amp}lt;/i{amp}gt; Grid{amp}lt;/a{amp}gt; {amp}lt;/li{amp}gt; {amp}lt;li class="nav-item"{amp}gt; {amp}lt;aa data-toggle="tab" href="#list" style="font-size: 12px"{amp}gt;{amp}lt;i class="fa fa-bars"{amp}gt;{amp}lt;/i{amp}gt; List{amp}lt;/a{amp}gt; {amp}lt;/li{amp}gt; {amp}lt;/ul{amp}gt; {amp}lt;div class="tab-content"{amp}gt; {amp}lt;div id="grid" class="tab-pane fade in active"{amp}gt; {amp}lt;?php $count_user = 0; ?{amp}gt; @foreach($initiated as $record) @if($count_user == 0) {amp}lt;div class="row margin-bottom-20 "{amp}gt; @endif {amp}lt;?php $count_user  ; ?{amp}gt; {amp}lt;div class="col-sm-6 sm-margin-bottom-20"{amp}gt; {amp}lt;div class="profile-blog"{amp}gt; {amp}lt;img style="border-radius: 0% !important" class="rounded-x" src="{{ asset('thumbnail') }}/{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;profile_picture : '' }}" alt="javascript - jQuery Ajax - все еще перезагружает страницу - нумерация страниц Laravel"{amp}gt; {amp}lt;div class="name-location" style="top: 30px;position: relative"{amp}gt; @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'individuals' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') {amp}lt;i style="font-size: 13px;position: relative;" class="icon-user"{amp}gt;{amp}lt;/i{amp}gt; @elseif($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'organizations' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') {amp}lt;i style="font-size: 13px;position: relative;" class="icon-hotel-restaurant-172 u-line-icon-pro fa- fa-lg"{amp}gt;{amp}lt;/i{amp}gt; @endif {amp}lt;a id="my-link" style="color: #555;text-decoration: none;font-size: 16px" href="{{ url('') }}/{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;username : '' }}"{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;username : '' }}{amp}lt;/a{amp}gt;{amp}lt;/h3{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="clearfix "{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;strong style="font-size: 13px"{amp}gt;{amp}lt;i style="padding: 5px" class="icon-real-estate-020 u-line-icon-pro"{amp}gt;{amp}lt;/i{amp}gt;Location : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;country-{amp}gt;country : '' }} {amp}lt;span class="{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;country-{amp}gt;flag : '' }}"{amp}gt;{amp}lt;/span{amp}gt;{amp}lt;br{amp}gt; {amp}lt;strong style="font-size: 13px"{amp}gt;{amp}lt;i style="padding: 5px" class="icon-notebook fa-"{amp}gt;{amp}lt;/i{amp}gt;Industry : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;industry-{amp}gt;industry : '' }}{amp}lt;br{amp}gt; @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'organizations' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') @if(isset($record-{amp}gt;user-{amp}gt;organization_type-{amp}gt;organization_type)) {amp}lt;strong style="font-size: 13px"{amp}gt;{amp}lt;i class="icon-hotel-restaurant-172 u-line-icon-pro fa- fa-lg" style="padding: 5px;font-size: 13px"{amp}gt;{amp}lt;/i{amp}gt;Organization : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;organization_type-{amp}gt;organization_type : '' }}@endif @endif @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'individuals' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') @if(!empty($record-{amp}gt;user-{amp}gt;career_path[0])) {amp}lt;strong style="font-size: 13px"{amp}gt;{amp}lt;i class="icon-speedometer" style="padding: 5px"{amp}gt;{amp}lt;/i{amp}gt;Function : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;career_path[0]-{amp}gt;functions-{amp}gt;function : '' }}@endif @endif {amp}lt;hr{amp}gt; {amp}lt;ul class="list-inline share-list"{amp}gt; {amp}lt;li{amp}gt; {amp}lt;a href="/cancel-invitation/{{$record-{amp}gt;id}}"{amp}gt;{amp}lt;i class="fa fa-times"{amp}gt; {amp}lt;/i{amp}gt;Cancel{amp}lt;/a{amp}gt; {amp}lt;/li{amp}gt; {amp}lt;/ul{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; @if($count_user == 2) {amp}lt;/div{amp}gt; {amp}lt;?php $count_user = 0; ?{amp}gt; @endif @endforeach {amp}lt;/div{amp}gt; {amp}lt;div id="list" class="tab-pane fade"{amp}gt; {amp}lt;?php $count_user = 0; ?{amp}gt; @foreach($initiated_tab_2 as $record) @if($count_user == 0) {amp}lt;div class="row"{amp}gt; @endif {amp}lt;?php $count_user  ; ?{amp}gt; {amp}lt;div class="col-sm-12 sm-margin-bottom-20" style="margin-bottom: 12px"{amp}gt; {amp}lt;div class="profile-blog" style="padding: 5px"{amp}gt; {amp}lt;img style="margin-right: 10px" src="{{ asset('thumbnail') }}/{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;profile_picture : '' }}" alt="javascript - jQuery Ajax - все еще перезагружает страницу - нумерация страниц Laravel"{amp}gt; {amp}lt;div class="name-location"{amp}gt; {amp}lt;h3{amp}gt; @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'individuals' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') {amp}lt;i style="font-size: 13px;position: relative;" class="icon-user"{amp}gt;{amp}lt;/i{amp}gt; @elseif($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'organizations' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') {amp}lt;i style="font-size: 13px;position: relative;" class="icon-hotel-restaurant-172 u-line-icon-pro fa- fa-lg"{amp}gt;{amp}lt;/i{amp}gt; @endif {amp}lt;a id="my-link" style="color: #555;text-decoration: none;font-size: 16px" href="{{ url('') }}/{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;username : '' }}"{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;username : '' }}{amp}lt;/a{amp}gt;{amp}lt;/h3{amp}gt; {amp}lt;ul class="list-inline share-list d-flex pull-right" style="bottom: 25px;position: relative;margin-bottom: -20px;left: -25px"{amp}gt; {amp}lt;li style="left: 25px;position: relative"{amp}gt; {amp}lt;a href="/cancel-invitation/{{$record-{amp}gt;id}}"{amp}gt;{amp}lt;i class="icon-custom-me rounded fa fa-times"{amp}gt; {amp}lt;/i{amp}gt;{amp}lt;/a{amp}gt; {amp}lt;/li{amp}gt; {amp}lt;/ul{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div style="display: flex;right: 2px;position: relative;bottom: 12px;margin-bottom: -10px"{amp}gt; {amp}lt;div style="padding-right: 15px"{amp}gt; {amp}lt;strong{amp}gt;{amp}lt;i class="icon-real-estate-020 u-line-icon-pro"{amp}gt;{amp}lt;/i{amp}gt; : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;country-{amp}gt;country : '' }} {amp}lt;span class="{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;country-{amp}gt;flag : '' }}"{amp}gt;{amp}lt;/span{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div style="padding-right: 10px"{amp}gt; {amp}lt;strong{amp}gt;{amp}lt;i class="icon-screen-tablet fa-"{amp}gt;{amp}lt;/i{amp}gt; : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;industry-{amp}gt;industry : '' }} {amp}lt;/div{amp}gt; {amp}lt;div style="padding-right: 10px"{amp}gt; @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'organizations' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') @if(isset($record-{amp}gt;user-{amp}gt;organization_type-{amp}gt;organization_type)) {amp}lt;strong{amp}gt;{amp}lt;i class="icon-speedometer"{amp}gt;{amp}lt;/i{amp}gt; : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;organization_type-{amp}gt;organization_type : '' }} @endif @endif {amp}lt;/div{amp}gt; {amp}lt;div style="padding-right: 10px"{amp}gt; @if($record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug == 'individuals' ? $record-{amp}gt;user-{amp}gt;role[0]-{amp}gt;slug : '') @if(!empty($record-{amp}gt;user-{amp}gt;career_path[0])) {amp}lt;strong{amp}gt;{amp}lt;i class="icon-frame fa-"{amp}gt;{amp}lt;/i{amp}gt; : {amp}lt;/strong{amp}gt;{{ $record-{amp}gt;user ? $record-{amp}gt;user-{amp}gt;career_path[0]-{amp}gt;functions-{amp}gt;function : '' }} @endif @endif {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/ul{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; @if($count_user == 2) {amp}lt;/div{amp}gt; {amp}lt;?php $count_user = 0; ?{amp}gt; @endif @endforeach {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/dl{amp}gt; {!! $initiated-{amp}gt;render() !!} {amp}lt;/div{amp}gt; 

Вот мой сценарий:

 {amp}lt;script type="text/javascript"{amp}gt; function ajaxPaging() { $('.pagination a').on('click', function (e) { e.preventDefault(); var url = $(this).attr('href'); $('#initiated').load(url   ' div#initiated', null, ajaxPaging); // re-run on complete }); } document.addEventListener("mousewheel", this.mousewheel.bind(this), { passive: false }); ajaxPaging(); {amp}lt;/script{amp}gt; 

Вот мой контроллер:

 $initiated = AppInvitation::with('user') -{amp}gt;where('inviter_id', Sentinel::getUser()-{amp}gt;id) -{amp}gt;orderBy('id', 'desc') -{amp}gt;paginate(6); 
Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector