Imaginez un site web dont le contenu est chargé via un menu à l'aide de jQuery .post() (ou .get()).
Imaginez qu'à l'intérieur de ce contenu dynamique chargé, il y ait un autre post jQuery pour afficher d'autres éléments sous le contenu.
(tout cela sans naviguer vers un nouveau fichier dans la barre d'adresse)
Voici ce que je veux dire (mais seulement le cadre de base...) :
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="text" name="n" id="n" placeholder="Search..." />
<button id="click1">Go</button>
<!-- the result of the search will be rendered inside this div -->
<br />
<div id="result" name="result"></div>
<script>
window.onload = (function(){
/* attach a submit handler to the button */
$("#click1").click(function(event) {
$.ajax({
url: 'test.php',
type: 'POST',
data: 'n: term',
success: function(msg) {
$( "#result" ).empty().append( msg );
}
});
});
});
</script>
</body>
</html>
Donc, arrêtez de rire, je sais que la page ne se charge que dans le div et cela ne fonctionne pas à cause des mêmes ID... c'est pas Inception ici ;-)
Mais même si j'y associe une toute nouvelle page avec de nouveaux identifiants, cela ne fonctionne pas...
Est-il possible d'ajouter un nouveau AJAX jQuery à l'intérieur d'un contenu existant, déjà chargé en AJAX jQuery ?
Je pense que oui, mais je n'arrive pas à trouver mon erreur...
/EDIT
Je pense que je dois donner un peu plus d'informations :
test.php
<input type="text" name="n" id="n" placeholder="Search..." />
<button id="click1">Go</button>
<div id="result" name="result"></div>
<script>
window.onload = (function(){
$("#click1").click(function(event) {
$.ajax({
url: 'test2.php',
type: 'POST',
data: 'n: term',
success: function(msg) {
$( "#result" ).empty().append( msg );
}
});
});
$("#click2").click(function(event) {
$.ajax({
url: 'test3.php',
type: 'POST',
data: 'n2: term',
success: function(msg) {
$( "#result2" ).empty().append( msg );
}
});
});
});
</script>
test2.php
<input type="text" name="n2" id="n2" placeholder="Search..." />
<button id="click2">Go</button>
<div id="result2" name="result2"></div>
test3.php
<?php
echo 'It´s working!';
?>
Ma dernière question : Pourquoi ça ne marche pas ? Pourquoi n'affiche-t-il pas "Ça marche !" à la fin ?