将ajax函数更改为模态引导程序

时间:2013-07-14 10:10:59

标签: javascript ajax twitter-bootstrap

我一直在尝试为我的网站使用bootstraps模式。现在我需要更改以下代码以与模态

一起使用
$(document.body).on('click','.socialIcon',null,function() {
    var id = $(this).attr('id').replace('social_','');
    var win = function(resp) {
        var dialogWin = $('#socRegPopup');
        if(dialogWin.length){
            dialogWin.remove();
        }
        $('#wrapper').append(resp);  
        dialogWin = $('#socRegPopup');
        dialogWin.dialog({ 
            autoOpen: true,
            width: 515,
            modal: true,
            position: 'center',
            resizable: false
        });
    };
    $.ajax({
        url: liveSite +'/index2.php?obj=social&task=getSocialForm',
        type:'get',
        data: {programId: id},
        success:win});    
});

我尝试将其更改为使用bootstraps模式

$(document.body).on('click','.socialIcon',null,function() {
    var id = $(this).attr('id').replace('social_','');
    var win = function(resp) { 
        $('#wrapper').append(resp);  
        $('#socRegPopup').modal();
    };
    $.ajax({
        url: liveSite +'/index2.php?obj=social&task=getSocialForm',
        type:'get',
        data: {programId: id},
        success:win});    
});

这个有效,但问题是数据没有变化 例如,当我单击按钮1时会有3个按钮,它将输出正确,但接下来所有按钮将输出按钮1数据。任何指导如何使模态在ajax上工作

1 个答案:

答案 0 :(得分:0)

这解决了我的问题。我不知道这是否是一个更好的解决方案

$(document.body).on('click','.socialIcon',null,function() {
    var id = $(this).attr('id').replace('social_','');
    var win = function(resp) { 

        var element = document.getElementById("socRegPopup");
        if(element){
        element.parentNode.removeChild(element);
     } 

        $('#wrapper').append(resp);  
        $('#socRegPopup').modal();
    };
    $.ajax({
        url: liveSite +'/index2.php?obj=social&task=getSocialForm',
        type:'get',
        data: {programId: id},
        success:win});    
});