JavaScript DHTML/Dojo toolkit/InlineEditBox
Содержание
Create inline text editor(dijit.InlineEditBox)
<source lang="html4strict">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.InlineEditBox"); dojo.addOnLoad(show); function show() { var descEditor = new dijit.InlineEditBox({ id : "description", autoSave : false, buttonSave : "Save", buttonCancel : "Cancel", width : "100%"}, dojo.byId("my") ); } </script> </head> <body class="tundra">
</body>
</html>
</source>
HTML tags inline editing
<source lang="html4strict">
<html>
<head>
<link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
<script type="text/javascript">
var djConfig = {
baseScriptUri : "js/dojo/",
parseOnLoad : true
};
</script>
<script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
<script>
dojo.require("dojo.parser");
dojo.require("dijit.form.Textarea");
dojo.require("dijit.InlineEditBox");
</script>
</head>
<body class="tundra">
Click to edit:
line 1
line 2
line 3
line 4
</body>
</html>
</source>
Inline text box
<source lang="html4strict">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.InlineEditBox");
</script> </head> <body class="tundra">
Edit me
</body>
</html>
</source>
Two inline editors
<source lang="html4strict">
<html>
<head> <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css"> <script type="text/javascript"> var djConfig = { baseScriptUri : "js/dojo/", parseOnLoad : true }; </script> <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> <script> dojo.require("dojo.parser"); dojo.require("dijit.form.Textarea"); dojo.require("dijit.InlineEditBox"); </script> </head> <body class="tundra"> Click to edit: Click to edit </body>
</html>
</source>