Bonjour à tous,
Je suis en train de réaliser une newsletter avec la possibilité de modifier en ligne mes boutons pour changer l'url et le titre du lien. Quand on clique sur un bouton pour le modifier, une modale s'affiche avec deux champs (input) : un champ pour titre et le second pour l'url. Ces champs récupèrent automatiquement le titre et l'url existant sur le bouton pour pouvoir les éditer. Tous les boutons font appel à la même fenêtre modale, c'est juste le contenu récupéré est qui différent d'un bouton à l'autre. Quand je clique sur le bouton "save" j'aimerais enregistrer la modification en base de données dans une même table mais dans des champs (colonnes table) différents pour chaque bouton. J'utilise la librairie jQuery et PHP pour l'interaction côté serveur.
Mon problème est je n'ai pas réussi à enregistrer mes modifs en base de données. Je ne sais pas comment procéder pour sauvegarder la modif dans la BD à partir d'une seule modale et que chaque bouton soit sauvegarder un champ différent. Merci par avance.
Modifié par dinolam (09 Jul 2017 - 23:28)
Je suis en train de réaliser une newsletter avec la possibilité de modifier en ligne mes boutons pour changer l'url et le titre du lien. Quand on clique sur un bouton pour le modifier, une modale s'affiche avec deux champs (input) : un champ pour titre et le second pour l'url. Ces champs récupèrent automatiquement le titre et l'url existant sur le bouton pour pouvoir les éditer. Tous les boutons font appel à la même fenêtre modale, c'est juste le contenu récupéré est qui différent d'un bouton à l'autre. Quand je clique sur le bouton "save" j'aimerais enregistrer la modification en base de données dans une même table mais dans des champs (colonnes table) différents pour chaque bouton. J'utilise la librairie jQuery et PHP pour l'interaction côté serveur.
Mon problème est je n'ai pas réussi à enregistrer mes modifs en base de données. Je ne sais pas comment procéder pour sauvegarder la modif dans la BD à partir d'une seule modale et que chaque bouton soit sauvegarder un champ différent. Merci par avance.
<!-- Partie HTML -->
<div>
<h4>Item 1</h4>
<p>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.</p>
<div ><a href="#" class="row-edit" data-type="link">J'en profite</a></div>
</div>
<div>
<h4>Item 2</h4>
<p>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.</p>
<div ><a href="#" class="row-edit" data-type="link">Contact</a></div>
</div>
<div>
<h4>Item 3</h4>
<p>Splendida porro oculi fugitant vitantque tueri. sol etiam caecat, contra si tendere pergas,propterea quia vis magnast.</p>
<div ><a href="#" class="row-edit" data-type="link">A propos</a></div>
</div>
<!-- Modale -->
<div class="edit" id="edit-link">
<div class="edit-box" style="height:310px;">
<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>
// Partie JS
//Edit
function hover_edit(){
$(".row-edit").hover(
function() {
$(this).append('<div class="row-edit-hover"><i class="fa fa-pencil" style="line-height:30px;"></i></div>');
$(".row-edit-hover").click(function(e) {e.preventDefault()});
$(".row-edit-hover i").click(function(e) {
e.preventDefault();
big_parent = $(this).parent().parent();
//edit link
if(big_parent.attr("data-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-link .edit-box-buttons-save").click(function() {
$(this).parent().parent().parent().fadeOut(500);
$(this).parent().parent().slideUp(500);
big_parent.text($("#edit-link .title").val());
big_parent.attr("href",$("#edit-link .url").val());
});
}
});
}, function() {
$(this).children(".row-edit-hover").remove();
}
);
}
hover_edit();
Modifié par dinolam (09 Jul 2017 - 23:28)
