jQuery Girl
  1. jQuery Girl
  3. Comment désactiver un bouton d’envoi lorsque la demande AJAX est en cours et l’activer après avoir reçu une réponse AJAX réussie?
Intereting Posts
Sélecteur jQuery avec variable jquery.form et requêtes interdomaines Ordre des lignes jqGrid par glisser-déposer Erreur: après l’ajout d’un compteur de texte sur la page d’accueil (comptez le nombre de caractères restants à l’aide de Jquery) – nécessite l’actualisation de la page Comment faire en sorte que la valeur d’une zone de sélection détermine les options d’une deuxième zone de sélection Comment sélectionner plusieurs cases à la fois? Comment déplacer un curseur horizontal ou un curseur vertical de jQuery à l’aide de Selenium Webdriver jQuery css gradient Comment valider des champs optionnels avec une valeur par défaut? Bonne approche de rendu et de mise à jour AJAX de la page par DRY jQuery Scale et Fade en même temps javascript ou jquery Entrez uniquement le numéro de texte et le masquage automatique La fonction jQuery onClick ne fonctionne pas Désactiver de manière dynamic la validation sur les contrôles asp.net Envoyer une simple requête GET

Comment désactiver un bouton d’envoi lorsque la demande AJAX est en cours et l’activer après avoir reçu une réponse AJAX réussie?

J’ai le code HTML suivant: 

 
  
  All Manufacturers Test RK Blue Nun Unique Imports Pernod Ricard Smoking Loon Beringer  
 
 
 
  
  All Products Riesling Superio Vodka Heineken Strong Bow Grocery Ruler Glass Brown Bread White Bread Cabernet Sauvignon  
 
 
 
 
 
      

Le code AJAX jQuery est le suivant: 

 function GetProductByManufacturerID(value) { $.ajax({ type: "POST", url: "add_rebate_by_quat_volume.php", data: { manufacturer_id: value, op:"" }, beforeSend: function() { $("#product_id").html(' Loading ...'); }, success:function(data){ $("#product_id").html(''); $("#product_id").append(data); } }); }

Je souhaite désactiver le bouton d’envoi lorsque la fonction AJAX est appelée en modifiant la valeur du contrôle de sélection (contrôle de sélection pour la sélection du fabricant). Cette valeur doit être désactivée jusqu’à réception de la réponse de réussite AJAX. Lorsque la réponse de succès AJAX sera reçue, l’utilisateur devrait pouvoir cliquer sur le bouton d’envoi. Comment y parvenir? Merci d’avance.

pour désactiver 

  $("#search").prop('disabled', true);

pour permettre 

  $("#search").prop('disabled', false);

comme ci-dessous dans votre fonction 

 function GetProductByManufacturerID(value) { $.ajax({ type: "POST", url: "add_rebate_by_quat_volume.php", data: { manufacturer_id: value, op:"" }, beforeSend: function() { $("#product_id").html(''); $("#search").prop('disabled', true); // disable button }, success:function(data){ $("#product_id").html(''); $("#product_id").append(data); $("#search").prop('disabled', false); // enable button } }); }

Quelque chose comme ça ferait ce que vous voulez. Ceci est global, pour toute la page, pour toute requête ajax. 

 $(document).ajaxStart(function() { $("#search").prop('disabled', true); }).ajaxStop(function() { $("#search").prop('disabled', false); });

Je voudrais désactiver le bouton avant l’appel ajax et l’activer à nouveau en cas de rappel de succès, un problème à faire quelque chose comme ci-dessous? 

  function GetProductByManufacturerID(value) { $('#search').addAttr('disabled'); $.ajax({ type: "POST", url: "add_rebate_by_quat_volume.php", data: { manufacturer_id: value, op:"" }, beforeSend: function() { $("#product_id").html(''); }, success:function(data){ $("#product_id").html(''); $("#product_id").append(data); $('#search').removeAttr('disabled'); } }); }