选项选择中的下拉列表在div内部时不会显示

Question

在用户使用jquery和ajax添加新的类别名称后，我正在尝试加载选项。我的HTML代码如下：

<div class="form-group fg-float">
    <div class="fg-line">
        <div class="col-sm-15 m-b-15">
            <p class="f-500 c-black m-b-15">Category name</p>
            <select class="chosen" data-placeholder="Choose a category name...">
                <?php
                $query_get_ob_category = mysqli_query($new_conn, "SELECT * FROM ob_category");

                if(mysqli_num_rows($query_get_ob_category) > 0) {
                    while($row = mysqli_fetch_assoc($query_get_ob_category)) {
                        echo '<option value="'.$row['category_name'].'">'.$row['category_name'].'</option>';
                    }
                } else {
                    echo '<option value="">Oh snap! There is no allotment code available!</option>';
                }
                ?>
            </select>
        </div>
    </div>
</div>

选项选择位于我的div 中。 div在我的模态中：

<!--Modal create other budget-->
<div class="modal fade create_other_budget" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="gridSystemModalLabel">Create another budget</h4>
      </div>
      <div class="modal-body">

        <div class="form-group fg-float">
            <div class="fg-line">
                <div class="col-sm-15 m-b-15">
                    <p class="f-500 c-black m-b-15">OB number: <span style="color:red;font-weight:bolder;" id="ob_number"></span></p>
                </div>
            </div>
        </div>

        <div class="form-group fg-float">
            <div class="fg-line">
                <div class="col-sm-15 m-b-15">
                    <p class="f-500 c-black m-b-15">Allotment code</p>
                    <select class="chosen" data-placeholder="Choose an allotment code..." id="create_allotment_code">
                        <option></option>
                        <?php
                        $query_get_allotment = mysqli_query($new_conn, "SELECT * FROM allotment");

                        if(mysqli_num_rows($query_get_allotment) > 0) {
                            while($row = mysqli_fetch_assoc($query_get_allotment)) {
                                echo '<option value="'.$row['allotment_code'].'">'.$row['allotment_code'].'</option>';
                            }
                        } else {
                            echo '<option value="">Oh snap! There is no allotment code available!</option>';
                        }
                        ?>
                    </select>
                </div>
            </div>
        </div>

        <div class="category_list">
        <!--load the category list here-->
        </div>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-success" id="create_ob">Create</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

当我尝试打开我的模态时，我的类别名称的选项选项将不会显示。

我在下面有我的ajax代码，允许我添加一个新的类别名称：

$('#create_category').click(function() {

    var ob_category_name = $('#ob_category_name').val();
    var data = 'ob_category_name='+ob_category_name;

    if(ob_category_name == '') {

        swal({
            title: "I feel empty :(",
            text: "Oh snap! You should type the category name that you desire!",
            type: "error",
            confirmButtonText: "Okay",
            confirmButtonColor: "#ff5454"
        })
    } else {

        $.ajax({

            type: "POST",
            url: base_url('ajax/ajaxAddCategory.php'),
            data: data,
            cache: false,
            beforeSend: function() {
                $.blockUI({ message: '<img src="'+base_url("img/loading.gif")+'"></img>', baseZ: 2000 });
                disableButton();
            },
            success: function(data) {

                if(data.trim() == 2) {

                    swal({
                        title: "Duplicate category!",
                        text: "Oh snap! The category named "+ob_category_name+" is already exist!",
                        type: "error",
                        confirmButtonText: "Okay",
                        confirmButtonColor: "#ff5454"
                    })
                } else {

                    if(data.trim() == 1) {
                        swal({
                            title: "Category created!",
                            text: "A new category for OB has been added!",
                            type: "success",
                            confirmButtonText: "Okay"
                        })
                    } else {

                        swal({
                            title: "Network error!",
                            text: "Oh snap! We cannot add a new category for your OB. Make sure that you have an internet connection!",
                            type: "error",
                            confirmButtonText: "Okay",
                            confirmButtonColor: "#ff5454"
                        })
                    }
                }
            }
        }).done(function() {
            $.unblockUI();
            LoadCategoryList();
            enableButton();
            clear();

            $('.modal_add_category').modal('hide');
        })
    }
})

并且我还有我的帖子请求，以便在已加载所有页面时加载选项：

function LoadCategoryList() {

    $.post('category.php', function(data) {
        $('.category_list').html(data);
    });
}

函数 LoadCategoryList（）; 从一开始就已加载：

$(document).ready(function() {

    LoadCategoryList();

})

我希望你能帮助我。我是新来的。