From ce1386ca4a674342db48912bd95270c035cab843 Mon Sep 17 00:00:00 2001 From: Alain Dumesny Date: Sat, 21 Dec 2019 19:30:23 -0800 Subject: [PATCH] demo showing adding item to nested grid * #95 works in the current node * nested.html now has add widget buttons. --- demo/float.html | 10 +++++----- demo/nested.html | 21 +++++++++++++++++++-- src/gridstack.d.ts | 7 ++++++- 3 files changed, 30 insertions(+), 8 deletions(-) diff --git a/demo/float.html b/demo/float.html index 59026f4d6..da61a03d1 100644 --- a/demo/float.html +++ b/demo/float.html @@ -44,11 +44,11 @@

Float grid demo

this.addNewWidget = function() { var node = this.items[count] || { - x: Math.round(12 * Math.random()), - y: Math.round(5 * Math.random()), - width: Math.round(1 + 3 * Math.random()), - height: Math.round(1 + 3 * Math.random()) - }; + x: Math.round(12 * Math.random()), + y: Math.round(5 * Math.random()), + width: Math.round(1 + 3 * Math.random()), + height: Math.round(1 + 3 * Math.random()) + }; this.grid.addWidget($('
' + count++ + '
'), node); return false; }.bind(this); diff --git a/demo/nested.html b/demo/nested.html index 6f61c5abe..fde47e225 100644 --- a/demo/nested.html +++ b/demo/nested.html @@ -26,6 +26,9 @@

Nested grids demo

+ Add Widget Grid1 + Add Widget Grid2 +

@@ -62,9 +65,23 @@

Nested grids demo

dragOut: true // let us drag them out! }; $('.grid-stack.top').gridstack(); - $('.grid-stack.nested1').gridstack(nestOptions); + var grid1 = $('.grid-stack.nested1').gridstack(nestOptions).data('gridstack'); nestOptions.dragOut = false; - $('.grid-stack.nested2').gridstack(nestOptions); + var grid2 = $('.grid-stack.nested2').gridstack(nestOptions).data('gridstack'); + + var count = 9; + addNewWidget = function(grid) { + var node = { + x: Math.round(12 * Math.random()), + y: Math.round(5 * Math.random()), + width: Math.round(1 + 3 * Math.random()), + height: Math.round(1 + 3 * Math.random()) + }; + grid.addWidget($('
' + count++ + '
'), node); + return false; + }; + $('#add-widget1').click(function () { addNewWidget(grid1)}); + $('#add-widget2').click(function () { addNewWidget(grid2)}); }); diff --git a/src/gridstack.d.ts b/src/gridstack.d.ts index 2394b40d2..a15a56735 100644 --- a/src/gridstack.d.ts +++ b/src/gridstack.d.ts @@ -444,10 +444,15 @@ interface GridstackOptions { disableResize ? : boolean; /** - * allows to override jQuery UI draggable options. (default?: { handle?: '.grid-stack-item-content', scroll?: true, appendTo?: 'body' }) + * allows to override jQuery UI draggable options. (default?: { handle?: '.grid-stack-item-content', scroll?: true, appendTo?: 'body', containment: null }) */ draggable ? : {}; + /** + * let user drag nested grid items out of a parent or not (default false) + */ + dragOut ? : boolean; + /** * draggable handle selector (default?: '.grid-stack-item-content') */