master

Branches (9)

Tags (88)

Manage

Manage

master

build-umd-with-rollup

omit-react-prefix

fix/bad-compacts

gh-pages

drag-api

tests

horizontalCompact

stable

0.16.6

0.16.5

0.16.4

0.16.3

0.16.2

0.16.1

0.16.0

0.15.3

0.15.2

0.15.1

0.15.0

0.14.7

0.14.6

0.14.5

0.14.4

0.14.3

0.14.2

0.14.1

0.14.0

0.13.9

react-grid-layout
/
examples
/
6-dynamic-add-remove.html

<!--
  Do not edit this file! It is generated by `generate.js` in this folder, from `template.ejs` and vars.js.
-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <script src="http://localhost:4002/dist/commons.js"></script>
    <script src="http://localhost:4002/dist/6-dynamic-add-remove.bundle.js"></script>
    <title>RGL Example 6 - Dynamic Add/Remove</title>
  </head>
  <body>
    <h3>React-Grid-Layout Demo 6 - Dynamic Add/Remove</h3>
    <ul>
      <li><a href="https://github.com/STRML/react-grid-layout">View project on GitHub</a></li>
      <li><a href="https://github.com/STRML/react-grid-layout/blob/master/test/examples/6-dynamic-add-remove.jsx">View this example's source</a></li>

      <li><a href="5-static-elements.html"><b>⇠</b> View the previous example: "Static Elements"</a></li>

      <li><a href="7-localstorage.html"><b>⇢ </b>View the next example: "LocalStorage"</a></li>
        </ul>
           <p>This demo shows what happens when items are dynamically added and removed.</p>
           <p>You can remove an item by clicking its "x", and add a new one with the button.</p>
           <p>To further illustration RGL's capacities, this particular example is responsive. Trying resizing the window.</p>
        <div id="content"></div>
  </body>
</html>