Question

我在盒子上解释了很多col。代码如下所示：

<div class="box box-info" id="box-form">
        <div class="box-header with-border">
            <h3 class="box-title">Form Buat EIR</h3>

            <div class="box-tools pull-right">

                <div class="input-group">
                    <button class="btn btn-box-tool" data-widget="collapse" id="minimize">
                        <i class="fa fa-minus"></i>
                    </button>
                </div>
            </div>
        </div><!-- /.box-header -->

        <div class="box-body">
            <?php echo form_open('', array('id' => 'upload_eir', 'class' => "form-horizontal")); ?>
                // A lot of form input
           <?php echo form_close(); ?>
        </div>

      <div class="box-footer">
         <button type="reset" class="btn btn-default">Cancel</button>
        <button type="submit" class="btn btn-info pull-right">Submit</button>
      </div><!-- /.box-footer -->

我像这样初始化这个框：

$('#minimize').click(function () {
    $('#box-form').toggleClass("collapsed-box");
});

$(document).on("submit", "#upload_eir", function () {
    $.ajax({
        url: "<?php echo base_url('admin/c_admin/update_json_detail'); ?>",
        type: "POST",
        data: {
            POST_ARRAY: table_data
        },
        dataType: 'json',
        success: function (obj) {
            //Collapse the box
        }
    });
    return false;
});

我的问题是，在提交AJAX成功后如何折叠框？

Answer 1

$('.box-body').css('opacity','0').css('visibility','hidden');
$('.box-body').modal('hide');
$('.box-body').remove;
$('.box-body').addClass('someclassname').removeClass('className').

如果你有多个类.box-body的元素玩：

$('div').find('.box-body').each(function(){ 
    /*do some think*/ 
})

提交成功后，Bootstrap折叠框

1 个答案: