关闭ajax弹出窗口并不起作用

时间:2016-06-28 22:26:22

标签: javascript jquery ajax popup popupwindow

我有一个可以使用的ajax弹出框(粘贴在下面),但我不知道如何关闭它。我尝试将.dialog(' close')添加到这样的成功行 - $('#dialog-ajax')。html(data).dialog(' close&# 39);

那不起作用。我还尝试用以下内容替换该行:

if (data.success) {
    App.success(data.success);
    $('#dialog-ajax').dialog('close');
}

再一次,没有去。谢谢你的帮助。

这是html代码:

<?php if ($this->details['changeLink'] && !$this->header_part) { ?>
    <label class="shipping">{{Tracking number}}:</label>
    <input id="tracking" class="fleft small" type="text" value="<?php echo $this->details['purchase']->tracking ?>" />
    <button id="change" class="small-button red-button fleft">{{Change}}   </button>
<?php } ?>

这是javascript:

<script type="text/javascript">
$(document).ready(function() {

    if ($.isFunction($.fn.selectbox)) {
        $('select').selectbox();
    }
    <?php if ($this->details['changeLink']) { ?>

            $('#change').click(function() {
                $.ajax({
                    url: '<?php echo $this->details['changeLink'] ?>',
                    type: 'POST',
                    data: {
                        id: <?php echo $this->details['purchase']->id ?>,
                        status: $('#shipping-status').val(),
                        tracking: $('#tracking').val(),
                        company: $('#company').val()
                    },
                    beforeSend: function() {
                        loading.loadFancy($('#dialog-ajax'));
                    },
                    success: function(data) {
                        $('#dialog-ajax').html(data);
                    }
                });
                return false;
            });

        <?php if ($this->successfu_edite) { ?>
                        App.success('{{Purchase is successfully changed!}}');
        <?php } ?>
    <?php } ?>

});
</script>

2 个答案:

答案 0 :(得分:0)

嗯,我不确定它是否可行,但逻辑上应该如此 试试这个

if (data.success) {
/*when the user click outside the pop up*/
$("#dialog-ajax").dialog('destroy').remove();

 }

答案 1 :(得分:0)

您的ajax调用存在语义错误。添加dataType属性并将方法属性和$ .ajax调用更改为以下内容:

<script type="text/javascript">
$(document).ready(function() {

    if ($.isFunction($.fn.selectbox)) {
        $('select').selectbox();
    }
    <?php if ($this->details['changeLink']) { ?>

            $('#change').click(function() {
                $.ajax({
                    url: '<?php echo $this->details['changeLink'] ?>',
                    //change method and dataType to reflect the following
                    method: 'POST',
                    dataType: 'json',
                    data: {
                        id: <?php echo $this->details['purchase']->id ?>,
                        status: $('#shipping-status').val(),
                        tracking: $('#tracking').val(),
                        company: $('#company').val()
                    },
                    beforeSend: function() {
                        loading.loadFancy($('#dialog-ajax'));
                    },
                    success: function(data) {
                        if (data.success) {
                            $("#dialog-ajax").fadeOut(900,'swing',function(){
                                $(this).css("display","none");
                            });
                        }
                    }
                });
                return false;
            });

        <?php if ($this->successfu_edite) { ?>
                        App.success('{{Purchase is successfully changed!}}');
        <?php } ?>
    <?php } ?>

});
</script>