| Index: recipes/web/html/replacing.html
|
| diff --git a/recipes/web/html/replacing.html b/recipes/web/html/replacing.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..86a9366798ab49b64b5f63596ed6d56fa02f79ee
|
| --- /dev/null
|
| +++ b/recipes/web/html/replacing.html
|
| @@ -0,0 +1,56 @@
|
| +<!DOCTYPE html>
|
| +
|
| +<html>
|
| + <body>
|
| +
|
| + <ul>
|
| + <li>Get crazy startup idea</li>
|
| + <li>Set up company
|
| + <ul>
|
| + <li>Build something</li>
|
| + <li>Raise money</li>
|
| + <li>Get users</li>
|
| + </ul>
|
| + <li>Profit!!!</li>
|
| + </ul>
|
| +
|
| + <script type="application/dart">
|
| +
|
| + import 'dart:html';
|
| +
|
| + void main() {
|
| +
|
| +
|
| + var span = new Element.html("<span>You can edit this. </span>");
|
| + var link = new Element.html("<a href='#'>Edit</a>");
|
| + var input = new Element.html(
|
| + "<input type='text' value='${span.innerHtml}' />");
|
| +
|
| + document.body.children.addAll([span, link]);
|
| + bool editing = false;
|
| +
|
| + link.onClick.listen((event) {
|
| + editing = !editing;
|
| + if (editing) {
|
| + span.replaceWith(input);
|
| + link.innerHtml = 'Done';
|
| + } else {
|
| + input.replaceWith(span);
|
| + link.innerHtml = 'Edit';
|
| + }
|
| +
|
| + event.preventDefault();
|
| + event.stopPropagation();
|
| + });
|
| +
|
| + queryAll('ul').forEach((item) {
|
| + var ol = new Element.tag('ol');
|
| + ol.children.addAll(item.children);
|
| + item.replaceWith(ol);
|
| + });
|
| + }
|
| + </script>
|
| +
|
| + <script src="packages/browser/dart.js"></script>
|
| + </body>
|
| +</html>
|
|
|