11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

sur un site wordpress, j'ai écrit une fonction en ajax avec $.post de jQuery.

la fonction lance une requête Wordpres pour récupérer le contenu d'un article et l'afficher dans la page sans recharger celle ci.

Je suis en local avec Wampserver et avec Firefox mon code fonctionne PARFAITEMENT, mais si je veux le tester avec Chrome ou IE (émulation Edge), la fonction Ajax ne retourne rien, elle est exécutée mais ne retourne rien.

Il y a des problèmes connus en local avec Chrome pour l'Ajax?
Pour moi aucune problème de ce genre,

utilise des console.log pour afficher des erreurs ou autres, voir à quel moment ça pète ?
as-tu bien la dernière version de Jquery ? peut être que tu as des erreurs de variable, firefox est plus flexible à ce niveau et laisse tout passer.
Modifié par JENCAL (26 Feb 2016 - 15:56)
pas de message dans la console de Chrome, juste un 0 (zéro)

(edit) ceci dit sur un autre forum je lis quelque part que " Chrome doesn't like AJAX from local files"
mais je n'ai pas encore eu le temps de tester mon code sur un serveur distant...

voici mon code js

'ajaxurl' représente un pointeur vers le fichier dédié à Ajax de Wordpress
wp_localize_script('vital-script', 'ajaxurl', admin_url( 'admin-ajax.php' ) );



jQuery(document).ready(function($)  {

	$("a.gear-sub-type").on("click", function(e)  {  
		$this = $(this);
		e.preventDefault();

		var titre  = $this.html();
		var slug   = $this.attr("data-slug");
		var taxId  = '#item-' + $this.attr("data-tax");

		$.post(
		    ajaxurl,
		    {
		        'action': 'show_instrument',
		        'slug': slug
		    },
		    function(response){
	            $(taxId).html(response).prepend("<h1>"+titre+"</h1>")
	            .slideDown();
	             }
		);

	});  // fin on click

});  // fin du ready()




le code PHP


// ---------------------fn ajax afficher l'instrument v_gear
add_action( 'wp_ajax_show_instrument', 'fn_show_instrument' );

function fn_show_instrument() {
	$slug = $_POST['slug']; 


	global $post;

	$type = 'mv_gear';
	$args=array(
	'post_type' => $type,
	'post_status' => 'publish',
	'name' => $slug,
	'posts_per_page' => -1
	);

	$req1 = new WP_Query($args);  

	if($req1->have_posts()):
		while($req1->have_posts()):  $req1->the_post();
			the_content();
		endwhile;
	endif;

	die();
}  // fin fn_show_instrument

Modifié par lionel_css3 (26 Feb 2016 - 16:26)
Administrateur
Il y a une différence entre local avec une URL de type file:// qui bloque effectivement la plupart des requêtes Ajax par sécurité et local avec du http://localhost/ qui va fonctionner de la même manière que sur le web. Il faut éviter d'utiliser l'IP de la machine par exemple http://127.0.0.1/ car là aussi les restrictions s'appliquent en l'absence de domaine identifiable.
alors en fait c'était pas lié au 'local' ou 'en ligne' puisque j'ai pu faire un test (négatif) en ligne.

il suffisait que j'ajoute la ligne

add_action( 'wp_ajax_nopriv_show_instrument', 'fn_show_instrument' );

après

add_action( 'wp_ajax_show_instrument', 'fn_show_instrument' );

car en fait avec Chrome (et IE) j'étais pas connecté dans l'admin et donc il ne trouvait pas la fonction Ajax.
Il y a un distinguo dans Wordpress pour l'Ajax en fonction du fait que l'on est connecté pou pas à l'admin du site, c'est pour ça que pour moi ça ne marchait qu'avec Firefox, car je suis toujours connecté..