Création formulaire en javascript
Bonjour à tous,
j'ai un petit souci au niveau de mon appel ajax, je vous explique:
J'ai une page (article.php) où y un formulaire qui va chercher des articles selon la date et la société, j'ai fait un appel ajax vers une page "action/SearchArticle.php" qui me retourne le résultat puis je l'affiche dans ma page article.php.
Dans les résultats y a un bouton modifié article, quand je clique je crée un formulaire dans un popup en Javascript avec les colonnes à modifier et là mon problème : je veux quand je clique sur submit de cet popup je fais un appel ajax à une page PHP pour modifier l'article mais ça ne marche pas.
Voilà comment j'ai fait
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82
|
$(document).ready(function() {
$('#result #modifier').click(function() {
// récuperer le id article
var popINC = $(this).attr('rel');
// récuperer commentaire article
var popComment = $("#result #comment"+ popINC).text();
//créer le commentaire
var comment = '<label for="comment">Commentaire</label><input type="text" id ="comment" name="comment" value="'+popComment+'"/>';
//créer une checkbox pour id_article
var inpInc = "<input type='checkbox' id='flag' name='flag[]' value='"+popINC+"'>"+popINC;
//construire le formulaire avec le id_article et commentaire
var contenu = '<form action="" method="post" id="changeFlag"><ul><li>'+inpInc+'</li><li>'+comment+'</li><button type="submit">Chercher</button></ul></form>';
// Afficher popup
$('#' + popID).html(contenu).fadeIn().css({
'width': Number(popWidth)
});
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>'); //Ajout du fond opaque noir
//Apparition du fond - .css({'filter' : 'alpha(opacity=80)'}) pour corriger les bogues de IE
// Cacher la page HTML
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
return false;
});
$('a.close, #fade').live('click', function() { //Au clic sur le bouton ou sur le calque...
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //...ils disparaissent ensemble
});
return false;
});
// Quand je clique sur mon formulaire modifier article crée dans la 1er partie
$("#changeFlag").submit(function(){
var dataString = $(this).serialize();
$.ajax({
type: "POST",
url:"../action/test.php",
dataType : 'html',
data:dataString,
success: function(response){
if(response){
alert('dede');
}
else{
$("#result").text("Errodr");
}
}
});
return false;
});
}); |
Le résultat : quand je clique sur submit du popup la page se réactualise et puis j'ai rien !
Merci d'avance