FAZENDO O GRID ABRIR LADO A LADO VIA AJAX COM DATATABLE

[Juinior Oliveira 0]

Ola pessoal quero fazer com que meu codigo grid ele faz a mesma coisa como a table que roda dentro do ajax datatable

conforme vai digitando vai aparecendo os resultado que estiver no banco de dados

Este código em baixo e do DATATABLE ele funciona perfeitamente do jeito ai

<?php
	
	/* Connect To Database*/
	require_once ("../conexion.php");

	
$action = (isset($_REQUEST['action'])&& $_REQUEST['action'] !=NULL)?$_REQUEST['action']:'';
if($action == 'ajax'){
	$query = mysqli_real_escape_string($con,(strip_tags($_REQUEST['query'], ENT_QUOTES)));

	$tables="tblprod";
	$campos="*";
	$sWhere=" tblprod.prod_name LIKE '%".$query."%'";
	$sWhere.=" order by tblprod.prod_name";
	
	
	include 'pagination.php'; //include pagination file
	//pagination variables
	$page = (isset($_REQUEST['page']) && !empty($_REQUEST['page']))?$_REQUEST['page']:1;
	$per_page = intval($_REQUEST['per_page']); //how much records you want to show
	$adjacents  = 4; //gap between pages after number of adjacents
	$offset = ($page - 1) * $per_page;
	//Count the total number of row in your table*/
	$count_query   = mysqli_query($con,"SELECT count(*) AS numrows FROM $tables where $sWhere ");
	if ($row= mysqli_fetch_array($count_query)){$numrows = $row['numrows'];}
	else {echo mysqli_error($con);}
	$total_pages = ceil($numrows/$per_page);
	//main query to fetch the data
	$query = mysqli_query($con,"SELECT $campos FROM  $tables where $sWhere LIMIT $offset,$per_page");
	//loop through fetched data
	


		
	
	if ($numrows>0){
		
	?>
		<div class="table-responsive">
			<table class="table table-striped table-hover">
				<thead>
					<tr>
						<th class='text-center'>Código</th>
						<th>Produto </th>
						<th>Categoría </th>
						<th class='text-center'>Stock</th>
						<th class='text-right'>Preço</th>
						<th></th>
					</tr>
				</thead>
				<tbody>	
						<?php 
						$finales=0;
						while($row = mysqli_fetch_array($query)){	
							$product_id=$row['id'];
							$prod_code=$row['prod_code'];
							$prod_name=$row['prod_name'];
							$prod_ctry=$row['prod_ctry'];
							$prod_qty=$row['prod_qty'];
							$price=$row['price'];						
							$finales++;
						?>	
						<tr class="<?php echo $text_class;?>">
							<td class='text-center'><?php echo $prod_code;?></td>
							<td ><?php echo $prod_name;?></td>
							<td ><?php echo $prod_ctry;?></td>
							<td class='text-center' ><?php echo $prod_qty;?></td>
							<td class='text-right'><?php echo number_format($price,2);?></td>
							<td>
								<a href="#"  data-target="#editProductModal" class="edit" data-toggle="modal"  data-id="<?php echo $product_id; ?>"><i class="material-icons" data-toggle="tooltip" title="Editar" >&#xE254;</i></a>
								<a href="#deleteProductModal" class="delete" data-toggle="modal" data-id="<?php echo $product_id;?>"><i class="material-icons" data-toggle="tooltip" title="Eliminar">&#xE872;</i></a>
                    		</td>
						</tr>
						<?php }?>
						<tr>
							<td colspan='6'> 
								<?php 
									$inicios=$offset+1;
									$finales+=$inicios -1;
									echo "Mostrando $inicios al $finales de $numrows registros";
									echo paginate( $page, $total_pages, $adjacents);
								?>
							</td>
						</tr>
				</tbody>			
			</table>
		</div>	

	
	
	<?php	
	}	
}
?>          
		  

Este é o meu GRID que quero que funcione dentro deste AJAX ai

        <section class="lis-grediant grediant-tb-white">
            <div class="container">
                <div class="row">
				<?php
mysqli_set_charset($con,"utf8");
$sql = mysqli_query($con,"select * from tblprod  WHERE prod_name order by prod_name DESC LIMIT 15");
while ($dados=mysqli_fetch_array($sql)){
                       $prod_id = $dados["prod_id"];
$prod_name = $dados["prod_name"]; $prod_img = $dados["prod_img"];
?>
       <div class="col-12 col-sm-4 col-lg-2 wow fadeInUp mb-4 mb-lg-0 text-center">
                        <a href="listing-no-map-fullwidth.html" class="text-white">
                            <div class="lis-categories rounded lis-font-poppins py-4"><img src="<?php echo ConfigPainel('site_url'); ?>/loja/images/<?php echo $prod_img; ?>" class="img-responsive" alt="img" width="100%" height="100%">
                                <div class="text-white mb-2 h2"></div>
                                <font color="#000"><?php echo $prod_name; ?></font>
                            </div> 
                        </a>
                    </div>
<?php
}
?>					
                </div>
            </div>
        </section>
        <!--End GRID -->

  Desde já fico grato