How get get list of pages in ajax search

Question

There is no get_pages() method in the WP_Query class (for WordPress version 4.9.4).

So in the data_fetch() function, replace the following:

if( $the_query->get_pages() ) :
    while( $the_query->get_pages() ): $the_query->get_pages(); ?>

..with this:

if( $the_query->have_posts() ) :
    while( $the_query->have_posts() ): $the_query->the_post(); ?>

And in the fetch() JS function, set the type to POST, like so:

function fetch(){
jQuery.ajax({
    url: '<?php echo admin_url('admin-ajax.php'); ?>',
    type: 'POST',
    data: { action: 'data_fetch', keyword: jQuery('#keyword').val() },
    success: function(data) {
        jQuery('#datafetch').html( data );
    }
});
}

Hint: In the data_fetch() function, I suggest you to use wp_die() instead of die(). You should also use wp_reset_query() in place of wp_reset_postdata() because you’re making a custom WP_Query call.

[EDIT] In reply to the following comment:

Can i please ask on how I can show child pages only of a parent page?

In the HTML form, you can add a hidden input which stores the parent page’s ID. And then add the value to the data in the AJAX request. Then in the WP_Query call (in the data_fetch() function), you can use post_parent to set the parent page’s ID.

See sample code here.