时间戳

首页 > 解决方案 > 如何在 Bootstrap Modal 上附加 .html()

php - 如何在 Bootstrap Modal 上附加 .html()

问题描述

我在选择框中选择 [product] 时遇到问题，它应该在 [quality] 列中附加 html。

我试图提醒 JQUERY 中的数据，它提醒我想要的结果。但它不能在 Bootstrap Modal 的 [quality] 列中附加 html。

看法

            <!--Bootstrap Modal-->
            <div class="modal fade" id="add_data_Modal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <!-- Modal Header -->
                        <div class="modal-header">
                            <h4 class="modal-title">Pledge Item</h4>
                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                        </div>

                        <!-- Modal body -->
                        <div class="modal-body">
                            <tr id="child_pledge_item">
                                <tr>
                                    <td>
                                        <?php
                                        $options = array(
                                                         '' => '~Select Product~'
                                                         );
                                        foreach ($prod as $product){
                                            $options[$product->product_id] = $product->product_type;
                                        }

                                        $select = array(
                                                        'name' => 'child_product_type[]',
                                                        'id'    => 'child_product_type',
                                                        'class' => 'form-control',
                                                        'required' => 'required'
                                                        );
                                        echo form_dropdown('child_product_type[]', $options,set_value('product_type'),$select);
                                    ?>
                                    </td>
                                </tr><br>
                                <tr>
                                    <td id="qual">
                                        <input type="number" id="quality_name[]" name="quality_name[]" class="quality_id form-control" step="any" value="" placeholder="Quality" readonly/>
                                        <input type="hidden" id="quality_id[]" name="quality_id[]" class="quality_id form-control" step="any" value="" readonly/>
                                    </td>
                                </tr><br>
                            </tr>
                        </div>
                    </div>
                </div>
            </div>

jQuery & AJAX

                $(':input[name="child_product_type[]"]').change(function(){

                    var product_id = $(':input[name="child_product_type[]"]').val();

                    if(product_id != ''){
                        $.ajax({
                            url:"<?php echo base_url();?>index.php/Pledge/GetQuality",
                            method: "POST",
                            data:{product_id:product_id},
                            success:function(data){
                                $('#qual').html(data);
                                $('#add_data_Modal').modal('show');
                                //alert(data);  
                            }
                        });
                    }else{
                        $('#qual').html('<input type="number" id="quality_name[]" name="quality_name[]" class="quality_id form-control" step="any" value="" placeholder="Quality" readonly/><input type="hidden" id="quality_id[]" name="quality_id[]" class="quality_id form-control" step="any" value="" readonly/>');

                    }
                });

标签： phpcodeigniterbootstrap-modal

解决方案

用此代码替换模态体。

需要将 tr 标签包裹在 table 标签内

    <div class="modal-body">
        <table>
            <tr id="child_pledge_item">
                <tr>
                    <td>
                        <?php
                        $options = array(
                                         '' => '~Select Product~'
                                         );
                        foreach ($prod as $product){
                            $options[$product->product_id] = $product->product_type;
                        }

                        $select = array(
                                        'name' => 'child_product_type[]',
                                        'id'    => 'child_product_type',
                                        'class' => 'form-control',
                                        'required' => 'required'
                                        );
                        echo form_dropdown('child_product_type[]', $options,set_value('product_type'),$select);
                    ?>
                    </td>
                </tr><br>
                <tr>
                    <td id="qual">
                        <input type="number" id="quality_name[]" name="quality_name[]" class="quality_id form-control" step="any" value="" placeholder="Quality" readonly/>
                        <input type="hidden" id="quality_id[]" name="quality_id[]" class="quality_id form-control" step="any" value="" readonly/>
                    </td>
                </tr><br>
            </tr>
        </table>
    </div>

推荐阅读