wp_send_json returns a full page with HTML included

Viewed 25

I have a wordpress site with a custom plugin I developed.

At some point, an AJAX call is made to the plugin code.

Plugin function calls wp_send_json($mensaje); so that the AJAX call shows a message to the user.

With default Wordpress theme, twentytwentytwo, it works perfectly, however, when I changed the theme to a custom one, the AJAX call returns the message decorated with the full HTML page.

What should the custom theme do so that the JSON returned from wp_send_json only contains the JSON code and not the full HTML page?

EDIT:

Ajax Code:

      jQuery.ajax({
                    url: document.location.href.replace(document.location.search, '') + '?accion=check_email',
                    type: 'post',
                    data: {
                        colegio: map.get('colegio'),
                        email: persistData('emailApoderado')
                    },
                    cache: false,
                    success: function (message, textStatus, jqXhr) {
                        if (message.length === 0) {
                            document.location.href = document.location.href.replace(document.location.search, '') + '?' + queryString;
                        } else {
                            showError(message);

                            if (typeof errorCallback === 'function') {
                                errorCallback();
                            }
                        }
                    },
                    error: function (jqXhr, textStatus, errorThrown) {
                        console.log(errorThrown);

                        if (typeof errorCallback === 'function') {
                            errorCallback();
                        }
                    }
                });

This is the plugin function:

   private function check_email() {
        global $wpdb;

        $email = QueryString::get_var('email');
        $colegio = QueryString::get_var('colegio');
  
        $apoderadoSQL = "SELECT 1 FROM {$wpdb->prefix}desytec_apoderado a, "
        . "{$wpdb->prefix}wc_customer_lookup c "
        . "WHERE c.customer_id = a.customer_id "
                . "AND c.email = %s "
                . "AND a.colegio_id = %d";
        $existe = $wpdb->get_var($wpdb->prepare($apoderadoSQL, $email, $colegio));

        $mensaje = "";
        if (empty($existe)) {
            $colegioSQL = "SELECT colegio_nombre FROM {$wpdb->prefix}desytec_colegio WHERE ID = %d";
            $nombreColegio = $wpdb->get_var($wpdb->prepare($colegioSQL, $colegio));
            $mensaje = "El mail '$email' no pertenece a un apoderado del colegio '$nombreColegio'.";
        }

        wp_send_json($mensaje);
    }

Result shown in web page:

enter image description here

The result seen in developer tools. It shows that the whole page template is rendered:

enter image description here

EDIT 2:

The entry point of the Ajax call is this:

public function __construct() {
    add_shortcode(
            'cargar_monedero',
            [$this, 'render']
    );
}

public function render() {
    ob_start();
    $this->output();
    return ob_get_clean();
}

public function output() {
    $accion = QueryString::get_var('accion');
    if ($accion == 'add_to_cart') {
        $this->add_to_cart();
    } else if ($accion == 'check_email') {
        $this->check_email();
    } else {
        $this->load_step();
    }
}
0 Answers
Related