Dojo domConstruct - Inserting rows into a table
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/resources/dojo.css">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dijit/themes/claro/claro.css">
<table id="formCreatorContainerTable">
<tr>
<td>
<div id="selectFormFieldsContainer"></div>
</td>
</tr>
<tr>
<td>
<div id="submitDataContainer" class="someClass"></div>
</td>
</tr>
<tr>
<td>
<div id="reselectFormFieldsButton" class="someClass"></div>
</td>
</tr>
<tr>
<td>
<div id="displayDataForm"></div>
</td>
</tr>
</table>
JavaScript
define(["dojo/dom", "dojo/dom-construct", "dojo/_base/declare", "dojo/_base/array", "dijit/Dialog", "dijit/form/Form", "dijit/form/Textarea", "dijit/form/Button", "dijit/form/CheckBox", "dijit/form/TextBox",
"dojo/fx/Toggler", "dojo/query", "dojo/_base/lang"],
function (dom, domConstruct, declare, array, Dialog, Form, TextArea, Button, Checkbox, TextBox, Toggler, query, lang) {
console.dir('TEST');
var checkList = new Form();
var submitSelectFieldsBtnTglr = new Toggler({
node: "selectFormFieldsContainer"
});
var reselectFormFieldsButtonTglr = new Toggler({
node: "reselectFormFieldsButton"
});
var fields = ['Air Temperature', 'Water Temperature', 'Nitrates', 'Ammonia', 'Phosphorus'];
var selectedFields = [];
// Loop that builds checklist of fields to submit
array.forEach(fields, function (item, i) {
domConstruct.create("label", {
innerHTML: item + ': ',
'for': item
}, dom.byId("selectFormFieldsContainer"));
new Checkbox({
id: item,
name: item,
label: item,
value: item,
title: item
}).placeAt(selectFormFieldsContainer);
});
// Button to move to submission portion
new Button({
id: 'submitSelectFieldsBtn',
name: 'submitSelectFieldsBtn',
value: 'submitSelectFieldsBtn',
label: 'Create Form',
onClick: function () {
submitSelectFieldsBtnTglr.hide();
// Now push the names of all the desired fields into an array
var selected = query(".dijitCheckBoxInput");
array.forEach(selected, function (item, i) {
if (item.checked) {
selectedFields.push(item.value);
}
});
// Now print the form to a new div
array.forEach(selectedFields, function (item, i) {
var root =...