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.