0

我的ajax调用有一个小问题,我会解释:

我有一个页面(article.php),其中有一个按日期和公司查找项目,我调用了一个 ajax 页面“action / SearchArticle.php”,它返回了我的结果,我在我的页面文章上发布了海报.php。

在结果中,我修改了一个按钮,当我单击时,我在带有要更改的列的 Javascript 弹出窗口中创建另一个按钮,并且存在我的问题:我希望在此弹出窗口中单击提交时对 PHP 页面进行 ajax 调用修改部分,但它不起作用。

我是这样做的

$(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;
    });
 });

结果:当我点击提交时弹出页面刷新然后我什么都没有!

先感谢您

4

1 回答 1

0

问题是,提交事件处理程序是在changeFlag创建表单之前注册的。因此,您需要更改提交事件注册以使用事件委托模型。

如果使用 jquery < 1.7 使用.live()

$("#changeFlag").live('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;
});

如果 jQuery >= 1.7 使用.on()

$(document).on('submit', '#changeFlag', 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;
});
于 2013-04-17T13:03:22.387 回答