Website scrapping tool using wordpress custom plugin part 8 ( datatable)

Web Scraping is a technique used to extract large amounts of data from websites extracted and saved them to a local file in your computer or to a database or can be used as API. Data displayed by most websites can be viewed by using a web browser only. They do not offer the functionality to save a copy of this data for use. Thus the only option is to copy and paste the selected data that is required, which in reality, is a very tedious job and may take hours complete. In other terms, Web Scraping is the technique of automating such a process, in place of manual work, the Web Scraping software performs the same task within seconds.

datatable cdn paste in header

<script src="https://cdn.datatables.net/2.0.3/js/dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.3/css/dataTables.dataTables.min.css">

all-websites.php

<div class="table-responsive container-fluid p-3" style="margin-top:30px;">
<table class="table table-stripped p-3" style="background:#f7f7f7; padding:30px" id="datatablespk">

<thead>

<th>S.No</th>
<th>Website url</th>
<th>Heading Selector</th>
<th>Thumbnail Selector</th>
<th>Details Page url selector</th>
<th>Action</th>

</thead>


<!-- loop start -->

<?php

global $wpdb;
$result = $wpdb->get_results("SELECT * FROM wp_websites");
foreach ($result as $key => $print) {
?>

<tr>
<td width='10%'><?php echo $key+1; ?></td>
<td width='25%'><?php echo $print->website_url; ?></td>
<td width='15%'><?php echo $print->heading_selector; ?></td>
<td width='15%'><?php echo $print->thumb_selector; ?></td>
<td width='25%'><?php echo $print->details_page_url; ?></td>
<td width='10%'>
<a href='admin.php?page=edit-website&id=<?php echo $print->id; ?>'>
<button class='btn btn-success btn-sm' type='button'>Edit</button></a> 

<button class='btn btn-danger btn-sm' type='button' data-toggle="modal" data-target="#myModal<?php echo $print->id; ?>">DELETE</button>

</td>
</tr>


<!-- The Modal -->
<div class="modal" id="myModal<?php echo $print->id; ?>">
<div class="modal-dialog">
<div class="modal-content">

<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title">Data Delete</h4>
<button type="button" class="close" data-dismiss="modal">&times;</button>
</div>

<!-- Modal body -->
<div class="modal-body">
Are You sure ? to want delete this <?php echo $print->website_url; ?> item.
</div>

<!-- Modal footer -->
<div class="modal-footer">
<a href="admin.php?page=delete-website&del=<?php echo $print->id; ?>">
<button type="button" class="btn btn-danger">Yes</button>
</a>
</div>

<div class="modal-footer">
<button type="button" class="btn btn-dark" data-dismiss="modal">No</button>
</div>

</div>
</div>
</div>



<?php 
}
?>

<!-- loop end -->
</table>
</div>

<script>

$(document).ready(function() {
$('#datatablespk').dataTable({
"scrollX": false,
"pagingType": "numbers"
} );
} );

</script>