Question

使用ajax和bootstrap-table库填充Bootstrap表。每次客户端使用套接字从我的服务器收到消息时，应该更新该表，我已经确认我的代码在服务器消息上执行，但表不会更新..？以下是在浏览器中运行的完整JavaScript：

url = "ws://192.168.1.116:8080";
ws = new WebSocket(url);

// event emmited when connected
    ws.onopen = function () {
        console.log('websocket is connected ...');
        // sending a send event to websocket server
        ws.send('connected');
    }
    // event emmited when receiving message 
    ws.onmessage = function (ev) {
        alert("message from server");
        $.ajax({
                type: 'POST',
                url: 'getqueue.php',
                datatype: "json",
                success: function(response) {
                    alert("ajax success")
                    var response_Array = $.parseJSON(response);
                    $(function () {
                        $('#maintable').bootstrapTable({
                            data: response_Array
                        });
                    });

                },
                error: function() {
                    //something
                }
            })
    }

表第一次成功更新，但如果再次触发该函数，则不会插入新数据。 w ^

HTML：

<body>
    <div class="container">
        <table id="maintable" data-height="460">
        <thead>
            <tr>
                <th data-field="queue">#</th>
                <th data-field="nation_name">Nation</th>
            </tr>
        </thead>
    </table>
    </div>
</body>

修改通过这样做有点解决了这个问题：

$('#maintable').bootstrapTable("destroy");
                    $(function () {
                        $('#maintable').bootstrapTable({
                            data: response_Array
                        });
                    });

我删除当前表并创建一个用新数据填充的新表。这可能不是最佳的，但对我的情况来说效果还不错。

更新Bootstrap表，其中已有数据？

0 个答案: