</> Source
<!DOCTYPE html>
	<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>
		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: "", 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);
				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() {
<body onload="doOnLoad();">
		<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 id="myForm" style="height:500px;margin-top: 50px;"></div>


Check documentation to learn how to use the components and easily implement them in your applications.