Controller displaying json data instead of html - php

Question

I am trying to fetch data using data and it is returning json in whole page.
This is my code on Controller to fetch products:
public function products(){
$allProducts = $this->product->has('Sizes')->has('Images')->paginate(9);
$prodCategories = $this->products_categories->get();
return response()->json( $allProducts);
}
And in the ajax, I have the following code:
$( document ).ready(function() {
$.ajax({
url: "{{ route('displayProduct') }}",
dataType: 'json',
method: 'get',
data: { _token:"{{ csrf_token() }}"},
success(response){
let array = response.data;
if(array == 0){
html += '<div class="block"><h2 class="aside-title">Product not found!</h2><p class="errorProduct">Sorry! There is no product in this category. Please search products on other categories</p></div>';
$('#productClick').html(html);
}
$.each( array, function( key, value ) {
let image = jQuery.makeArray(value.images);
html += '<div class="product-layout product-layout-table col-lg-4 col-md-4 col-sm-6 col-xs-6 col-12">';
html += '<div class="product-box clearfix">';
html += '<div class="product-image">';
html += '<a href="/product/'+value.slug+'" class="c-img link-product">';
html += '<img src="'+image[0]['image']+'" class="img-responsive" alt=""></a>';
html += '<a class="smooth quickview iframe-link btn-button quickview quickview_handler visible-lg" href="/quick/'+value.slug+'" title="Quick view" target="_self" data-fancybox-type="iframe">';
html += '<i class="fa fa-search" aria-hidden="true"></i></a></div>';
html += '<div class="product-info"><h4 class="product-name">'+value.title+'</h4>';
html += '<div class="price">'+value.price+' <span class="price-old">$142.00</span></div>';
html += '<div class="product-desc">';
html += '<p>'+value.excerpt+'</p></div></div>';
html += '<div class="button-group"><button class="add-to-cart smooth" onclick="window.location.href=\'cart.html\'">ADD TO CART</button></div></div></div></div></div>';
});
$('#productClick').html(html);
loadIframe();
}
});
});
But, when I load the product I am getting json data on the whole page.
The function loadFrame has following code:
function loadIframe(){
$.getScript( "ajax/test.js" )
}