WordPress Do WP_Query via Custom Ajax Function

<?php

// functions.php

function do_wp_query_via_ajax(){
 
 //ini_set('display_errors', 1);
 //ini_set('display_startup_errors', 1);
 //error_reporting(E_ALL);
 
 // Endpoint: /wp-admin/admin-ajax.php?action=do_wp_query_via_ajax
 // &post_type={{post_type}}&posts_per_page=10&cpage=2
 // &{{taxonomy_slug_1}}={{term_slug_1}}&{{taxonomy_slug_2}}={{term_slug_2}}
 
 $args = array();
 
 foreach($_GET as $key => $value){
 if ( $value ){
 $args[$key] = $value;
 }
 }
 
 // Checking required fields
 if (!isset($args["post_type"])){
 exit;
 }
 
 // Re-store fields not in standard WP Query
 $cpage = $args["cpage"];
 
 // Pagination
 $posts_per_page = $args["posts_per_page"];
 $offset = ( $cpage * $posts_per_page ) - $posts_per_page;
 $args["offset"] = $offset;
 
 // Unset fields not in standard WP Query
 unset($args["action"]);
 unset($args["cpage"]);
 
 $the_query = new WP_Query( $args );
 
 $total = $the_query->found_posts;
 $total_pages = ceil($total / $posts_per_page);
 
 $query_result_array = array();
 
 if ( $the_query->have_posts() ) {
 
 while ( $the_query->have_posts() ) {
 
 $the_query->the_post();
 
 $title = get_the_title();
 $content = get_the_content();
 $date = get_the_date("Y-m-d");
 $url = get_permalink();
 
 $this_array = array(
 "title" => $title,
 "content" => $content,
 "date" => $date,
 "url" => $url,
 );
 
 array_push($query_result_array, $this_array);
 
 }
 
 }
 
 wp_reset_postdata();
 
 $response_array = array(
 "status" => "success",
 // "message" => "some_message_here",
 "cpage" => $cpage,
 "total_pages" => $total_pages,
 "post_type" => $args["post_type"],
 "data" => $query_result_array,
 );
 
 $response = json_encode($response_array);
 echo $response;
 
 exit;
}
add_action('wp_ajax_do_wp_query_via_ajax', 'do_wp_query_via_ajax'); // For Logged-in Users
add_action('wp_ajax_nopriv_do_wp_query_via_ajax', 'do_wp_query_via_ajax' ); // For Unauthenticated Users

<!-- HTML -->

<div id="search-filter"
 data-query="&post_type=post&posts_per_page=6"
 data-capge="1">
 
 <div class="row"> 
 <div class="col-lg-12">
 <label for="category_name">Sort by</label>
 <select class="form-select form-select-ajax-field" name="category_name" aria-label="Sort by">
 <option value="" selected>Please Select..</option>
 <option value="One">One</option>
 <option value="Two">Two</option>
 <option value="Three">Three</option>
 </select>
 <select class="form-select form-select-ajax-field" name="item_color" aria-label="Sort by">
 <option value="" selected>Please Select..</option>
 <option value="Red">Red</option>
 <option value="Orange">Orange</option>
 <option value="Yellow">Yellow</option>
 </select>
 </div>
 </div>
</div>

<script>
// Javascript with PHP in HTML Header
function js_get_site_url(){
  return "<?php echo get_site_url(); ?>";
}
</script>

<script>
// Javascript with JQuery

jQuery(function(){

 jQuery(".search-filter-box .form-select-ajax-field").change(function(){

 js_do_wp_query_via_ajax("action=load_more");

 });

 });

 function js_do_wp_query_via_ajax(query=""){
 
 var search_filter = jQuery('#search-filter');
 
 // https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams
 var query_params = new URLSearchParams(query);
 
 var search_query_str = "";
 
 search_query_str += search_filter.attr("data-query");
 
 search_filter.find(".form-select-ajax-field").each(function () {

 search_query_str += "&" + jQuery(this).attr("name") + "=" + jQuery(this).val();

 });
 
 if (query_params.get('action') == "load_more") {
 
 // DO SOMETHING
 
 var cpage = search_filter.attr("data-cpage");
 cpage++;

 search_filter.attr("data-cpage", cpage);
 search_query_str += "&cpage=" + cpage;
 
 }
 
 jQuery.ajax({
 url: js_get_site_url() + '/wp-admin/admin-ajax.php?action=do_wp_query_via_ajax' + search_query_str,
 dataType: 'json',
 success: function (data) {
 
 if (data) {
 
 var tmphtml = "";
 var cpage = data.cpage;
 var total_pages = data.total_pages;
 
 if ( cpage == total_pages || total_pages == 0 ){
 // NOT DISPLAYING LOAD MORE BTN
 }
 
 var post_type = data.post_type;
 var data = data.data;

 for (let i = 0; i < data.length; i++) {
 
 if ( post_type == "post" ){
 
 tmphtml += '<h1>' + data[i].title + '</h1>';
 tmphtml += '<div>' + data[i].content + '</div>';
 
 }
 
 }
 
 if (query_params.get('action') == "load_more") {
 
 jQuery("#result").append(tmphtml);
 
 } else {
 
 jQuery("#result").html(tmphtml);
 
 }
 }
 }
 
 });
 
 }



</script>