Note
</> Source
<!DOCTYPE html>
<html>
<head>
<title>Note</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
<script src="../../../codebase/dhtmlx.js"></script>
<script>
var myForm, formData, sel;
function doOnLoad() {
sel = byId("formName");
formData = [
{type: "settings", position: "label-left", labelWidth: 130, inputWidth: 150, noteWidth: 160},
{type: "input", name: "name", label: "Full name", value: "James Belop", note: {text: "please enter your full name here"}},
{type: "input", name: "mail", label: "E-mail address", value: "james@mail.com", offsetTop: 10},
{type: "checkbox", name: "news", label: "Subscribe on news", checked: true, offsetTop: 10, note: {text: "you will get our news once a week"}}
];
myForm = new dhtmlXForm("myForm", formData);
myForm.forEachItem(function(id){
sel.options.add(new Option(myForm.getItemLabel(id),id));
});
}
function byId(id) {
return document.getElementById(id);
}
function setNote() {
myForm.setNote(sel.options[sel.selectedIndex].value, {text: byId("formNote").value});
}
function clearNote() {
myForm.clearNote(sel.options[sel.selectedIndex].value);
}
</script>
</head>
<body onload="doOnLoad();">
<div>
<select id="formName"></select>
<input type="text" id="formNote" value="leave blank if you plan to use account as gift for someone">
<input type="button" onclick="setNote();" value="set">
<input type="button" onclick="clearNote();" value="clear">
</div>
<div id="myForm" style="height:500px;margin-top: 50px;"></div>
</body>
</html>
Documentation
Check documentation to learn how to use the components and easily implement them in your applications.