从JSON在gridster小部件上显示文本内容

时间:2018-03-09 11:25:41

标签: javascript jquery json gridster gridstack

我有一些gridster小部件。我想在它们上面显示来自json的文本内容(后端数据库,为了简单,我现在将硬编码)。

默认函数可以从json变量生成网格。但是我还想在生成小部件后立即在这些小部件上显示文本

我的JS代码从数据库获取变量并从中生成网格

$(function() {
    gridster = $(".gridster ul").gridster({
        widget_base_dimensions: [100, 55],
        widget_margins: [5, 5]
    }).data('gridster');

    $('.js-seralize').on('click', function() {
        $.ajax({
            url:'127.0.0.1:8000/home',
            type:'GET', // This is the default though, you don't actually need to always mention it
        });

        var serialization = {
            {
                variable
            }
        };

        serialization_sorted = Gridster.sort_by_row_and_col_asc(serialization);
        gridster.remove_all_widgets();

        $.each(serialization_sorted, function() {
            gridster.add_widget('<li />', this.size_x, this.size_y, this.col, this.row);
        });
    });
}

我的HTML

<div class="controls">
    <button class="js-seralize">Restore</button>
</div>

<div class="gridster">
<ul>
</ul>

我得到的JSON是默认格式

[{"col":1,"row":1,"size_x":1,"size_y":1},{"col":2,"row":1,"size_x":1,"size_y":1},{"col":1,"row":2,"size_x":1,"size_y":1}]

我只是希望网格上的文本内容(通过修改JSON等)或任何方式

0 个答案:

没有答案