Support » Themes and Templates » Making an Ajax Call using jQuery

  • Good evening friends,

    I’m trying to update the contents of a drop down menu depending on the selected term of a previous one. I’m trying to populate Vehicle models depending on the Vehicle make chosen (just that it makes more sense).

    Here is the code I’m using in the functions.php file:

    function custom_js_functions(){
        wp_enqueue_script( 'custom.js', get_bloginfo('template_directory') . "/js/custom.js", array( 'jquery' ) );
    add_action( 'init', 'custom_js_functions' );

    The contents of custom.js :

    jQuery(document).ready( function() {
    	jQuery('select#make').change( function() {
    		jQuery('select#model').load('theme/url/js/ajax.php', {"term_id" : jQuery('select#make option:selected').val() });

    Finally the code inside the ajax.php file located inside the theme’s folder:

    if( isset( $_REQUEST['term_id'] )) {
    	$parent_term_id = $_REQUEST['term_id'];
    	$sub_terms = get_terms( 'vehicle', array( 'orderby' => 'name', 'order' => 'ASC', 'hide_empty' => 0, 'parent' => $parent_term_id ) );
    	$terms_html = '';
    	foreach( $sub_terms as $sub_term ) {
    		$terms_html .= '<option value="'. $sub_term->term_id .'">'. $sub_term->name .'</option>';
    	echo $terms_html;

    I’m getting the following error when the code runs:
    Fatal error: Call to undefined function get_terms() in /home/public_html/dev/wp-content/themes/theme-name/ajax.php on line 4

    Has anyone experienced an error like this one before? Am I doing this the wrong way?

    Thank you.

  • The topic ‘Making an Ajax Call using jQuery’ is closed to new replies.