在引导模式中将 ajax 成功数据显示为数据表

Question

我试图在单击链接时在引导弹出模式中显示 ajax 返回的成功数据。我试过但我不知道我必须在哪里调用数据表函数。

在 index.php 中，我有一个模态 div 和 ajax 函数来调用 data.php。 data.php 返回 json 编码值。

index.php

<a href="#myModal" id="custId" data-toggle="modal" data-id="" class="btn btn-primary">Show Popup</a>


    <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h5 class="modal-title"><i class="glyphicon glyphicon-list"></i> Stone Details</h5>
            </div>
            <div class="modal-body">
                <div class="fetched-data">
                    <table id="example" class="display" cellspacing="0" width="100%">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Position</th>
                            <th>Office</th>
                        </tr>
                    </thead>
                    </table>   
                </div>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>



    $(document).ready(function() {

        $('#myModal').on('show.bs.modal', function (e) {
            var rowid = '1';
            var reference = '2';
            var nemix_id = '3';
            $.ajax({
                type : 'post',
                url : 'data.php', //Here you will fetch records 
                data :  'rowid='+ rowid+'&reference='+reference+'&nemix_id='+nemix_id, //Pass $id
                success : function(data){

                    $('#example').DataTable( {
                        "ajax": data
                    });

                }
            });


        });


} );

数据.php

$sql_sel = mysqli_query($con,"SELECT * FROM `table`");
$array = array();
$array['data'] = array();

while($res_sel = mysqli_fetch_row($sql_sel)){
    $array['data'][] = $res_sel;
}
echo json_encode($array);

Answer 1

我想通了……我在这里分享给其他人

var table = $('#example').DataTable( {
    "ajax": {
            "type" : "GET",
            "url" : "data.php",
            "dataSrc": function ( json ) {
                return json.data;
            }       
            }
    });

Answer 2

如果你需要在加载时显示模态，试试这个：

$(document).ready(function() {
    // show the modal onload
    $('#myModal').modal({
        show: true
    });
    $('#myModal').on('show.bs.modal', function (e) {
        var rowid = '1';
        var reference = '2';
        var nemix_id = '3';
        $.ajax({
            type : 'post',
            url : 'data.php', //Here you will fetch records 
            data :  'rowid='+ rowid+'&reference='+reference+'&nemix_id='+nemix_id, //Pass $id
            success : function(data){

                $('#example').DataTable( {
                    "ajax": data
                });

            }
        });
    });
});