76 lines
2.0 KiB
HTML
76 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
|
<title>View generation -- Model-bound generation example</title>
|
|
|
|
<script src="../../../dojo/dojo.js"
|
|
type="text/javascript"
|
|
djConfig="isDebug: true, parseOnLoad: true">
|
|
</script>
|
|
<style type="text/css">
|
|
@import "css/app-format.css";
|
|
@import "../../../dijit/themes/claro/claro.css";
|
|
</style>
|
|
<script type="text/javascript" >
|
|
dojo.require("dojox.mvc");
|
|
dojo.require("dojox.mvc.Generate");
|
|
dojo.require("dijit.form.Textarea");
|
|
dojo.require("dojo.parser");
|
|
|
|
function updateView() {
|
|
var modeldata = dojo.fromJson(dijit.byId("modelArea").value);
|
|
var model = dojox.mvc.newStatefulModel({ data : modeldata });
|
|
dijit.byId("view").set("ref", model);
|
|
};
|
|
dojo.addOnLoad(updateView);
|
|
</script>
|
|
</head>
|
|
<body class="claro">
|
|
<div id="wrapper">
|
|
<div id="header">
|
|
<div id="navigation"></div>
|
|
<div id="headerInsert">
|
|
<h1>View generation example</h1>
|
|
<h2>Data Binding - Generate Container.</h2>
|
|
</div>
|
|
</div>
|
|
<div id="main">
|
|
<div id="leftNav"></div>
|
|
<div id="mainContent">
|
|
<h3>Model</h3>
|
|
<div class="row">
|
|
<textarea class="cell" data-dojo-type="dijit.form.Textarea" id="modelArea" data-dojo-props="onBlur: updateView">
|
|
{
|
|
"Serial" : "360324",
|
|
"First" : "John",
|
|
"Last" : "Doe",
|
|
"Email" : "jdoe@example.com",
|
|
"Address": {
|
|
"Street" : "123 Valley Rd",
|
|
"City" : "Katonah",
|
|
"State" : "NY",
|
|
"Zip" : "10536"
|
|
},
|
|
"Phones" : [{
|
|
"Areacode" : "111",
|
|
"Local" : "111-1111"
|
|
},{
|
|
"Areacode" : "222",
|
|
"Local" : "222-2222"
|
|
}],
|
|
"Member" : {
|
|
"Since" : "2010",
|
|
"Type" : "Gold"
|
|
}
|
|
}
|
|
</textarea>
|
|
</div>
|
|
<h3>Generated View</h3>
|
|
<div id="view" data-dojo-type="dojox.mvc.Generate" data-dojo-props="idNameMapping:{'String' : 'view_t'}"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|