Comment charger une page PHP dans un div avec jQuery et AJAX ?

Question

J'essaie d'écrire une fonction qui appelle getproduct.php?id=xxx lorsqu'on clique dessus. Je peux obtenir le innerHTML pour apparaître, mais comment faire pour appeler également la partie php page qui fait réellement le travail ?

var id = id;
document.getElementById("digital_download").innerHTML = 
    "Downloading...Please be patient. The process can take a few minutes."; 
url = getproduct.php?id=id;

Answer 1

Vous pouvez appeler ou charger une page php à l'intérieur d'un div en utilisant cette ligne comme :-.

$("#content_div").load("ajax/page_url.php");

le "ajax/page_url.php" est un chemin relatif du fichier php.

donc ici vous pouvez le remplacer par l'url externe aussi.

Veuillez partager vos connaissances si je me trompe.

Answer 2

Vous pouvez le faire avec jQuery par exemple.

var id = 1;
$('#digital_download').html('Downloading...'); // Show "Downloading..."
// Do an ajax request
$.ajax({
  url: "getproduct.php?id="+id
}).done(function(data) { // data what is sent back by the php page
  $('#digital_download').html(data); // display data
});

Answer 3

Il existe de nombreuses façons de charger une page dans une division .

La méthode même est

var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }

xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        document.getElementById('digital_download').innerHTML=xmlhttp.responseText;
    }
}
   xmlhttp.open("GET", 'getproduct.php?id=' + id,true);
   xmlhttp.send();
}

il s'agit d'une méthode typique sans référence externe.

Si vous suivez la référence, il y a 5 façons de faire un appel ajax avec jQuery.

---

• load() : Charger un morceau de html dans un DOM de conteneur.
• jQuery.getJSON() : Charger un JSON avec la méthode GET.
• jQuery.getScript() : Chargez un JavaScript.
• jQuery.get() : Utilisez cette option si vous souhaitez effectuer un appel GET et jouer longuement avec la réponse.
• jQuery.post() : Utilisez ceci si vous voulez faire un appel POST et ne voulez pas charger la réponse dans un DOM du conteneur.
• jQuery.ajax() : Utilisez cette option si vous devez faire quelque chose lorsque le XHR échoue, ou si vous devez spécifier des options ajax (par exemple cache : true) à la volée. vol.

---

Answer 4

Edit : la question originale ne faisait pas référence à jQuery. Je laisse cette réponse ici car d'autres pourraient la trouver utile.

Voici comment procéder en utilisant l'objet XHR pour une requête ajax sans jQuery ou Prototype ou autre bibliothèque JS.

var xmlhttp;
if (window.XMLHttpRequest) {
    xmlhttp = new XMLHttpRequest();
} else {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById('digital_download').innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", 'getproduct.php?id=' + id,true);
    xmlhttp.send();
}

Answer 5

Vous pouvez utiliser la requête get ou post en utilisant la requête

$.ajax({
type: "POST",
url: url,
data: data,
success: success,
dataType: dataType
});

exemple