I am trying to make pagination for refresh div using Ajax.Its all working well but when I clicked to the next page, the page will refreshing the data and return back to the first page.How to prevent page from return back to the first page while the div refreshed.
Thank you
live-feed.blade.php
<!DOCTYPE html>
<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css" rel="stylesheet">
<script>
$(document).ready(function() {
setInterval(function() {
$("#table_data").load(window.location.href + " #table_data");
}, 3000);
});
</script>
</head>
<body>
<div class="container-fluid">
<div id="table_data">
<table id="table" class="table table-striped table-bordered" style="width:100%">
<thead style="color: #343a40">
<tr>
<th>Model</th>
<th>Model Name</th>
<th>Actual</th>
<th>Target</th>
</tr>
</thead>
<tbody>
@foreach($scans as $live)
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
@endforeach
</tbody>
<div class="d-flex justify-content-end mt-2">
{!! $scans->links() !!}
</div>
</table>
</div>
</div>
</body>
</html>
main-scanning.blade.php
@extends('layouts.admin')
@section('content')
<!DOCTYPE html>
<html>
<head>
<title>Live Feed</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid py-3">
<div class="card mt-4">
<div class="card-header" style="background-color: #343a40; color: white;">
<span><strong>Latest Production Output</strong></span>
<span class="float-right"></span>
</div>
<div class="card-body">
<div id="table_data">
@include('live-feed')
</div>
</div>
</div>
</div>
</body>
</html>
@endsection
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire