Le code est modifié et transféré dans une autre catégorie. Merc
Bonjour Tom,
Si ton problème se situe au niveau des données à envoyer au serveur pour faire ta sauvegarde, je peux m’y pencher moyennant un https://codepen.io/ pour mettre en évidence ton soucis.
Si la suite de tes soucis se situe côté serveur, une fois que t’es données ont été envoyé, je passe la main à un dev PHP.
Bonjour @Haeresis,
Merci pour ta réponse.
Oui mon problème se situe au niveau de la sauvegarde des données côté serveur.
Je récupère bien les données via ma requête ajax sous format json (pas de souci à ce niveau là) mais au niveau de la sauvegarde côté serveur (avec php) ça ne fonctionne pas. L’enregistrement est réalisé soit avec des données vides ou soit dans des mauvaises colonnes. Merci par avance !
Je te mets le code HTML, JS et PHP complet :
// Récupération contenu newsletter
// include connection file
require_once "db.php";
$sql1 = 'SELECT * FROM newsletter WHERE newsletter_id = 1';
$req1 = $db->prepare($sql1);
$req1->execute() or die(print_r($req1->errorInfo()));
$row1 = $req1->fetch();
$sql2 = 'SELECT * FROM newsletter WHERE newsletter_id = 2';
$req2 = $db->prepare($sql2);
$req2->execute() or die(print_r($req2->errorInfo()));
$row2 = $req2->fetch();
$sql3 = 'SELECT * FROM newsletter WHERE newsletter_id = 3';
$req3 = $db->prepare($sql3);
$req3->execute() or die(print_r($req3->errorInfo()));
$row3 = $req3->fetch();
<!-- corps de la newsletter -->
<div>
<h4 class="row-edit" data-type="title"><?=$row1['titre'];?></h4>
<p class="row-edit" data-type="image"><img src="<?=$row1['image_01'];?>"></p>
<p class="row-edit" data-type="text"><?=$row1['description'];?></p>
<div ><a href="<?=$row1['url_lien']; ?>" class="row-edit" data-type="link" data-id="<?=$row1['newsletter_id']; ?>"><?= $row1['titre_url_lien']; ?></a></div>
</div>
<div>
<h4 class="row-edit" data-type="title"><?=$row2['titre'];?></h4>
<p class="row-edit" data-type="image"><img src="<?=$row2['image_02'];?>"></p>
<p class="row-edit" data-type="text"><?=$row2['description'];?></p>
<div ><a href="<?=$row2['url_lien']; ?>" class="row-edit" data-type="link" data-id="<?=$row2['newsletter_id']; ?>"><?= $row2['titre_url_lien']; ?></a></div>
</div>
<div>
<h4 class="row-edit" data-type="title"><?=$row3['titre'];?></h4>
<p class="row-edit" data-type="image"><img src="<?=$row3['image_03'];?>"></p>
<p class="row-edit" data-type="text"><?=$row3['description'];?></p>
<div ><a href="<?=$row3['url_lien']; ?>" class="row-edit" data-type="link" data-id="<?=$row3['newsletter_id']; ?>"><?= $row3['titre_url_lien']; ?></a></div>
</div>
<div id="msg"></div>
<!-- Fin corps de la newsletter -->
<!-- Modale -->
<div class="edit" id="edit-image">
<div class="edit-box" style="">
<div class="edit-box-title">Edit Link</div>
<div class="edit-box-content">
<div class="edit-box-content-text">Title</div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input title"/></div>
<div class="edit-box-content-text">URL:<span>(full address including http://)</span></div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input url"/></div>
</div>
<div class="edit-box-buttons">
<div class="edit-box-buttons-save">Save</div>
<div class="edit-box-buttons-cancel">Cancel</div>
</div>
</div>
</div>
<div class="edit" id="edit-title">
<div class="edit-box" style="">
<div class="edit-box-title">Edit Link</div>
<div class="edit-box-content">
<div class="edit-box-content-text">Title</div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input title"/></div>
<div class="edit-box-content-text">URL:<span>(full address including http://)</span></div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input url"/></div>
</div>
<div class="edit-box-buttons">
<div class="edit-box-buttons-save">Save</div>
<div class="edit-box-buttons-cancel">Cancel</div>
</div>
</div>
</div>
<div class="edit" id="edit-text">
<div class="edit-box" style="">
<div class="edit-box-title">Edit Link</div>
<div class="edit-box-content">
<div class="edit-box-content-text">Title</div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input title"/></div>
<div class="edit-box-content-text">URL:<span>(full address including http://)</span></div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input url"/></div>
</div>
<div class="edit-box-buttons">
<div class="edit-box-buttons-save">Save</div>
<div class="edit-box-buttons-cancel">Cancel</div>
</div>
</div>
</div>
<div class="edit" id="edit-link">
<div class="edit-box" style="">
<div class="edit-box-title">Edit Link</div>
<div class="edit-box-content">
<div class="edit-box-content-text">Title</div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input title"/></div>
<div class="edit-box-content-text">URL:<span>(full address including http://)</span></div>
<div class="edit-box-content-field"><input type="text" class="edit-box-content-field-input url"/></div>
</div>
<div class="edit-box-buttons">
<div class="edit-box-buttons-save">Save</div>
<div class="edit-box-buttons-cancel">Cancel</div>
</div>
</div>
</div>
<!-- Fin Modale -->
console.clear();
(function hover_edit(){
var big_parent;
$(".row-edit").hover(
function() {
$(this).append('<span class="row-edit-hover"><i class="fa fa-pencil" style="line-height:30px;"></i></span>');
},
function() {
$(this).children(".row-edit-hover").remove();
}
)
$("a").click(function(e) {e.preventDefault()});
$("body").on('click', ".row-edit-hover i", function(e) {
e.preventDefault();
big_parent = $(this).parent().parent();
//edit title
if(big_parent.attr("data-type")=='title'){
$("#edit-title .title").val(big_parent.text());
$("#edit-title").fadeIn(500);
$("#edit-title .edit-box").slideDown(500);
}
//edit text
if(big_parent.attr("data-type")=='text'){
$("#edit-text .text").val(big_parent.text());
$("#edit-text").fadeIn(500);
$("#edit-text .edit-box").slideDown(500);
}
//edit image
if(big_parent.attr("data-type")=='image'){
$("#edit-image .image").val(big_parent.children('img').attr("src"));
$("#edit-image").fadeIn(500);
$("#edit-image .edit-box").slideDown(500);
}
//edit link
if(big_parent.attr("type")=='link'){
$("#edit-link .title").val(big_parent.text());
$("#edit-link .url").val(big_parent.attr("href"));
$("#edit-link").fadeIn(500);
$("#edit-link .edit-box").slideDown(500);
}
$(".edit-box-buttons-save").click(function() {
var toSave = {};
$(this).parents('.edit').fadeOut(500).children().slideUp(500);
big_parent.text($("#edit-title .title").val());
big_parent.text($("#edit-text .text").val());
big_parent.attr("href",$("#edit-link .url").val());
big_parent.attr("src",$("#edit-image .image").val());
toSave = {
'id' : big_parent.data('id'),
'url' : big_parent.attr('href'),
'img' : big_parent.attr('src'),
'text' : big_parent.text()
}
console.info(toSave);
$.post("page-update.php", toSave, function(response) {
if(response.status) {
$("#msg").removeClass('danger');
$("#msg").addClass('success').html(response.msg);
} else {
$("#msg").removeClass('success');
$("#msg").addClass('danger').html(response.msg);
}
}, 'json');
});
$(".edit-box-buttons-cancel").click(function() {
$(this).parents('.edit').fadeOut(500).children().slideUp(500);
});
});
})();
// page-update.php
// include connection file
require_once "db.php";
function update_newsletter($url,$img,$text,$id){
$sql = "UPDATE newsletter SET url_lien = :url, titre_url_lien = :text, titre = :text, description = :text, image = :img WHERE newsletter_id = :id";
$datas = array(":url"=>$url, ":img"=>$img, ":text"=>$text, ":id"=>$id);
return queryExec($sql,$datas);
}
function queryExec($sql,$datas){
global $db;
try {
$req = $db->prepare($sql);
$res = $req->execute($datas);
$result = array(
'status'=> $res,
'msg'=>'Saisie enregistrée avec success !',
'debug'=>array("requete"=>$sql, "datas"=>$datas)
);
} catch (Exception $e) {
//erreur dans la requete
$result = array(
'status'=>false,
'msg'=>'Erreur ! '.$e->getMessage(),
'debug'=>array("requete"=>$sql, "datas"=>$datas)
);
}
return $result;
}
//récupération "propre" des variable)
$id = !empty($_POST['id']) ? $_POST['id'] : NULL;
$url = isset($_POST['url']) ? $_POST['url'] : "";
$img = isset($_POST['img']) ? $_POST['img'] : "";
$text = isset($_POST['text']) ? $_POST['text'] : "";
if($id){
$msg = update_newsletter($url,$img,$titre,$id);
} else {
//pas d'ID
$msg = array( 'status'=>false,
'msg'=>"Erreur ! ID de ligne vide !",
'debug'=>$_POST
);
}
// send data as json format
echo json_encode($msg);
Re bonjour @Tom
Tu auras peut-être plus de chance en étiquetant ce sujet avec du « PHP », « SQL ».
Si le transfert client serveur ce passe bien (c.-à-d. que les 4 variables sous //récupération "propre" des variable) affiche bien les valeurs que tu as envoyé avec un echo ou affiche les bonnes valeurs dans ton debuggeur) alors n’encombre pas ton interlocuteurs avec les détails clients. Contente toi de fournir la structure de table, le code PHP et les codes/messages d’erreurs éventuels.
À bientôt.
Re @Haeresis
J’ai mis ce sujet dans le forum PHP aussi.
Je mets l’exemple complet pour qu’on puisse comprendre ma démarche. Je pense que c’est un sujet assez complexe et donc sans le code JS mon interlocuteur ne pourrait pas vite comprendre ce que je souhaiterais faire.
// Structure de la table `newsletter`
CREATE TABLE IF NOT EXISTS `newsletter` (
`newsletter_id` int(11) NOT NULL AUTO_INCREMENT,
`url_lien` varchar(255) NOT NULL,
`titre_url_lien` varchar(255) NOT NULL,
`titre` varchar(255) NOT NULL,
`description` text NOT NULL,
`image` varchar(255) NOT NULL,
PRIMARY KEY (`newsletter_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;
// Contenu de la table `newsletter`
INSERT INTO `newsletter` (`newsletter_id`, `url_lien`, `titre_url_lien`, `titre`, `description`, `image`) VALUES
(1, 'http://link-j-en-profite', 'J''en profite', 'Item 1', 'Incenderat autem audaces usque ad insaniam homines ad haec, quae nefariis egere conatibus, Luscus quidam curator urbis subito visus: eosque ut heiulans baiolorum praecentor ad expediendum quod orsi sunt incitans vocibus crebris. qui haut longe postea ideo vivus exustus est.', 'image_01.jpg'),
(2, 'http://link-contact', 'Contact', 'Item 2', 'Incenderat autem audaces usque ad insaniam homines ad haec, quae nefariis egere conatibus, Luscus quidam curator urbis subito visus: eosque ut heiulans baiolorum praecentor ad expediendum quod orsi sunt incitans vocibus crebris. qui haut longe postea ideo vivus exustus est.', 'image_02.jpg'),
(3, 'http://link-a-propos', 'A propos', 'Item 3', 'Incenderat autem audaces usque ad insaniam homines ad haec, quae nefariis egere conatibus, Luscus quidam curator urbis subito visus: eosque ut heiulans baiolorum praecentor ad expediendum quod orsi sunt incitans vocibus crebris. qui haut longe postea ideo vivus exustus est.', 'image_03.jpg');
Bonjour @Haeresis,
J’ai réussi à enregistrer certains éléments mais mon problème maintenant c’est au niveau de la sauvegarde des titres et descriptions. Puisque c’est une même variable pour les éléments texte : $text = isset($_POST['text']) ? $_POST['text'] : ""; j’ai un champ vide après sauvegarde. La console m’affiche ceci :
{“status”:true,“msg”:“Saisie enregistrée avec success !”,“debug”:{“requete”:“UPDATE newsletter
SET titre = :text WHERE newsletter_id = :id”,“datas”:{":text":"",":id":“11”}}}
Merci pour ton aide.
Cordialement,
Je n’ai pas compris ton précédent message :
Je ne vois comprend pas quelle ligne te renvoi {"status":true,"msg":"Saisie enregistrée avec success !","debug":{"requete":"UPDATE newsletter SET titre = :text WHERE newsletter_id = :id","datas":{":text":"",":id":"11"}}}, je sais pas quel outils utilise des : pour nommer les clés des objets JSON.
Cela sera p-e plus clair pour un développeur PHP ?
Re @Haeresis,
Ce que je t’ai mis c’est le résultat de ma requête ajax :
{“status”:true,“msg”:“Saisie enregistrée avec success !”,“debug”:{“requete”:“UPDATE newsletter SET titre = :text WHERE newsletter_id = :id”,“datas”:{":text":"",":id":“11”}}}
Il n’y a de numéro de ligne puisque ce n’est pas un message d’erreur. C’est après modification d’un titre par exemple et en cas de succès c’est ce que affiche la console. Mes résultats sont dans un format json avec ‘cle’:‘valeur’ :
toSave = {
'id' : big_parent.data('id'),
'url' : big_parent.attr('href'),
'img' : big_parent.attr('src'),
'text' : big_parent.text()
};
$.post("page-update.php", toSave, function(response){
............................
}, 'json');