Ошибка Javascript при добавлении сетки с помощью Gridster

$(function ($) {

    var gridster;
    widget_base_width: 240;
    widget_base_height: 240;
    widget_margin_h: 10;
    widget_margin_v: 10;
    gridActive: false;

    this.gridster = $('.gridster ul').gridster({
        widget_margins         : [this.widget_margin_h, this.widget_margin_v],
        widget_base_dimensions : [this.widget_base_width, this.widget_base_height],
        helper                 : 'clone',
        draggable              : {}
    }).data('gridster');

    $(".chart-button").click(function () {
        this.gridster.add_widget('<li id="hideil"><div id="test">heloooooo</div></li>');
    });

});

Я использую этот код для добавления плитки с помощью gridster, но получаю сообщение об ошибке:

Uncaught TypeError: Не удается прочитать свойство add_widget неопределенного
(анонимная функция)
x.event.dispatch jquery-1.10.2.min.js:22
v.handle jquery-1.10.2.min .js:22


person Prateik    schedule 05.03.2015    source источник


Ответы (1)


this объект вашего обработчика кликов не совпадает с this объектом за его пределами. Контекст другой: внутри обработчика объект this указывает на $('.chart-button'). Вы можете определить переменную вне обработчика и использовать ее:

var gridster = $('.gridster ul').gridster(...).data('gridster');

$(".chart-button").click(function () {
    gridster.add_widget('<li id="hideil"><div id="test">heloooooo</div></li>');
});

или вы можете привязать this (переопределить контекст для обработчика) к обработчику:

this.gridster = $('.gridster ul').gridster(...).data('gridster');

$(".chart-button").click(function () {
    gridster.add_widget('<li id="hideil"><div id="test">heloooooo</div></li>');
}.bind(this));
person Pavel Reznikov    schedule 08.03.2015