Comment puis-je mettre à jour le DOM avec nouvel élément d'enregistrement ajouté après appel?
dois-je retourner le contenu de l'enregistrement DB nouvellement inséré sur rappel, puis appends à l'aide de jQuery?
Veuillez conseiller si ce n'est pas assez de données Pour répondre à la question. Chaque enregistrement ressemble à ceci:
5 Réponses :
$.post(
"posts_in.php",
$("#postentry").serialize(),
function(data){
$('#myDivOnThePage').append(data);
}
);
Si les données contiennent un nouvel enregistrement, alors oui, analysez-le et appendez-le là où et comme vous le souhaitez.
En créant un nouveau jsfiddle.net avec un exemple, je peux vous aider un peu plus ...
Vous pouvez soit renvoyer un enregistrement complet dans le div de PHP ou vous pouvez simplement obtenir l'identifiant nouvellement inséré et construire l'enregistrement en JavaScript.
J'utiliserais $. AJAX () code> au lieu de $. POST () CODE>: $.ajax({
type:'post',
url: 'posts_in.php',
data: $("#postentry").serialize(),
success:function(data){
var id='post349';
$('<div></div>').attr('id',id).addClass('myclass').html(data).appendTo('#records_wrapper');
}
});
Comment puis-je retourner l'identifiant de l'enregistrement nouvellement ajouté pour l'insertion également?
Vous voudrez renvoyer un objet JSON de votre page posts_in.php, quelque chose comme ceci: echo json_encode ('{"id": "Post349", "record": "Ceci est un texte"}'); . Ensuite, dans votre réponse AJAX Succès: Fonction () , vous pouvez faire référence à l'objet comme data.id et data.record . Vous souhaitez également ajouter DataType: 'Json' à vos paramètres AJAX afin que JQuery sait analyser les données entrantes.
Peut-être sa question idiote mais lorsque vous allez pour "View Source", il ne montrera pas de code changé. Donc ça va être sympa de référencement?
@Alienwebguy je ne sais pas vraiment comment le contenu.php devrait ressembler. J'ai vu ce message il y a quelque temps ...
Dans votre fichier JS, vous pouvez écrire ceci
function updateDomAfterAjaxCall() {
$post_ID = $_POST['post_id'];
// Carefully tranverse the dom to
// Update records of the DOM that is
// affected by the new entry
// so that it behave almost like
// headless browser
// Target footer-postentry
// header-postentry, sidebar-postentry, content-postentry
$result = '';
$record_from_db = ""
$results.='<div class="myclass" >'.$record_from_db.'</div>';
die($result);
}