TransWikia.com

admin-ajax error 400

WordPress Development Asked by Daniel Nebert on November 26, 2021

I’ve gotten the following code to work when I put it in functions.php of a theme, but because it was causing other pages to have errors, I’ve created a child theme and am attempting to put the code in there. But now I’m getting a error 400 code.

My child themes style.css file:

/*
Theme Name: Agent Search
Theme URI: http: //mysite.com/
Description: This is a custom child theme I have created.
Author: My Name
Author URI: http: //mysite.com/
Template: page-builder-framework
Version: 0.1
*/
@import url("../page-builder-framework/style.css");

My functions.php file:

<?php

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

add_action('wp_ajax_zip_search', 'zip_search');
add_action('wp_ajax_nopriv_zip_search', 'zip_search' );
function zip_search()
{
    global $wpdb;
    
    //  Functional code omitted for now.  Just need to get "here" paragraph return (for now)
    
    $output = "<p>here</p>";
    $response = array(
        'data' => $output,
    );

    wp_send_json_success($response);
}

add_action( 'wp_enqueue_scripts', 'my_load_scripts' );
function my_load_scripts() {

    // Enqueue javascript on the frontend.
    wp_enqueue_script(
        'zip_js',
        get_template_directory_uri() . '-child-agent_search/js/zip_search.js',
        array('jquery')
    );

    // The wp_localize_script allows us to output the ajax_url path for our script to use.
    wp_localize_script(
        'zip_js',
        'myAjax',
        array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) )
    );
}

?>

And my zip_search.js file is:

jQuery(document).ready( function() {
    console.log("Document loaded");
    
    jQuery("#searchButton").click( function(e) {
      console.log("Search button clicked");
      e.preventDefault(); 
      var zipCode = document.getElementById("inputField").value;
   
      var data = {
        'action' : "zip_search",
        'zip_code' : zipCode
      };

      console.log("Zip code entered: " + data.zip_code);
      console.log("WP AJax URL: " + data.action);
   
      jQuery.ajax({
         type : "post",
         dataType : "json",
         url : data.action,
         data : data,
      
         success: function(response) {
            console.log(response.data);
            if(response.success) {
                console.log("response.type == success");
                jQuery("#results").html(response.data.data);
            }
            else {
                console.log("response.type == else");
                console.log(response.data);
            }
         },
         error: function(errorThrown){
            console.log("In error, error thrown!");
            console.log(errorThrown);
        }
      })  
   })
});

Again, this worked when the code was placed directly in the parents functions.php. Does anyone have any suggestions? Thank you all in advance!

=========
Edit 1:10pm CST 07/22/2020

I just changed the action to "zip_search".

Also wanted to mention I am using "Multiple Themes Plugin" so I can have this one page use the child theme I am creating.

=========
Edit 8:40am CST 07/23/2020

I asked a new (better) question to solve my problem at: Targeting single page with JS

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP