Search code examples
javascriptjqueryajaxgridster

adding a widget gridster.js


i'm trying to add a widget the an already existing grid dynamically from a database using ajax like so:

$.post("gestion.php",{ 
    event : "true"
    },
    function(data,status){
        // return the name of the image like so : ImageName#x#y
        var arrayVal= data.split('#');

        var x= arrayVal[1];
        var y= arrayVal[2];

        //the result of the array : x = 2 , y = 1

        console.log("x = '" + x + "' - y = '" + y +"'");
        gridster.add_widget.apply(gridster, ['<li><img src="img/'+ arrayVal[0] +'"/></li>', x, y]);
    }
)

The image are generated properly but it is placed halfway between the col1 and col2 and the grid start bugging.

Adding the value directly from the array like: gridster.add_widget.apply(gridster, ['<li><img src="img/'+ arrayVal[0] +'"/></li>', arrayVal[1], arrayVal[2]]);

Doesn't work too...

But when i try to enter the parameters the "hard way" like so : gridster.add_widget.apply(gridster, ['<li><img src="img/'+ arrayVal[0] +'"/></li>', 2, 1]);

The image are added properly in the bottom of my grid.

How can i get my values so the plug-in doesn't bug? The numbers are displayed properly when i do a console.log The php and the AJAX are encoded as UTF-8 and the database are encoded as utf8_unicode_ci

Sorry for my rusty english...


Solution

  • I've found the solution for my problem, i just added a parseInt() around my array values. the values of my array was considred as string for what ever reasons