ajaxurl non definito sul front-end


25

Sto cercando di creare una forma Ajax sul lato anteriore. Sto usando il codice

    jQuery.ajax(
        {
            type: "post",
            dataType: "json",
            url: ajaxurl,
            data: formData,
            success: function(msg){
                console.log(msg);
            }
        });

per il quale sto ricevendo un errore

Uncaught ReferenceError: ajaxurl is not definedworklorAjaxBookForm @ 
?page_id=2:291onclick @ ?page_id=2:202

Durante l'utilizzo di un codice simile sul back-end dell'amministratore funziona. Quale URL devo usare per elaborare la richiesta Ajax?


Controlla questo tutorial. Potrebbe esserti d'aiuto. 1stwebdesigner.com/implement-ajax-wordpress-themes
— Nilambar Sharma

Risposte:


48

Nel backend c'è una ajaxurlvariabile globale definita da WordPress stesso.

Questa variabile non è creata da WP in frontend. Significa che se si desidera utilizzare le chiamate AJAX in frontend, è necessario definire tale variabile da soli.

Un buon modo per farlo è usare wp_localize_script.

Supponiamo che le tue chiamate AJAX siano nel my-ajax-script.jsfile, quindi aggiungi wp_localize_script per questo file JS in questo modo:

function my_enqueue() {

    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/my-ajax-script.js', array('jquery') );

    wp_localize_script( 'ajax-script', 'my_ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );

Dopo aver localizzato il tuo file JS, puoi usare l' my_ajax_objectoggetto nel tuo file JS:

jQuery.ajax(
    {
        type: "post",
        dataType: "json",
        url: my_ajax_object.ajax_url,
        data: formData,
        success: function(msg){
            console.log(msg);
        }
    });

2
posso usare wp_localize_scriptsenza dover usare wp_enqueue_scritp?
— dread_cat_pirate,

1
Usi l'handle di script in wp_localize_script, quindi devi usare wp_enqueue_script per almeno uno dei tuoi script. Ma ... Non usare wp_enqueue_script non è una buona idea (si rischiano alcuni conflitti e problemi di dipendenze).
— Krzysiek Dróżdż

non ho alcuno script esterno da caricare, voglio solo usare ajaxurl per effettuare una chiamata ajax. non è possibile?
— RT

E dove inserirai questa chiamata AJAX? Come script in linea? È una pessima idea ...
— Krzysiek Dróżdż

ho un modulo separato, in quanto sto gestendo la convalida e al momento dell'invio, una chiamata ajax per inviare il modulo con ovviamente il modo wordpress aggiungendo hook. comunque ho capito come usare ajaxurl.
— RT

33

per usare direttamente ajaxurl, nel tuo file plugin aggiungi questo:

add_action('wp_head', 'myplugin_ajaxurl');

function myplugin_ajaxurl() {

   echo '<script type="text/javascript">
           var ajaxurl = "' . admin_url('admin-ajax.php') . '";
         </script>';
}

è quindi possibile utilizzare la ajaxurlrichiesta for ajax.


1
Questa risposta ajaxurlequivale allo stesso modo all'uso predefinito. Che è molto meglio della risposta accettata.
— Abel Melquiades Callejo,

vero, ma è inutile se lo si utilizza in un file .js.
— Jules il

1
@Jules ajaxurlè ancora disponibile in un *.jsfile. Per fare ciò, potrebbe essere necessario dichiarare la ajaxurlvariabile all'inizio del caricamento della pagina. Un'altra cosa da considerare è la chiamata *.jsdel tuo file esterno . Il file esterno dovrebbe essere chiamato DOPO ilajaxurl è stato istanziato ed essere dato il valore URL destra.
— Abel Melquiades Callejo
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.