Saving Example

<html>
	<head>
		<script src="../../../../codebase/touchui.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="../../../../codebase/touchui.css" type="text/css" charset="utf-8">
	</head>
	<body>
		<script type="text/javascript" charset="utf-8">
			dhx.ready(function(){
				dhx.ui({
					rows:[// to the first row we put toolbar with 2 buttons
						{view:"toolbar", type:"MainBar", data:[// the parameter 'data' specifies controls of the toolbar
							{type:"button", label:"Add", click:"add_item" },
							{type:"button", label:"Remove", click:"remove_item" }
						]},
						{  // to the second row we put list filled with data from file  - 'data.php'
							view:"list", id:"mylist", url:"data.php",
							type:{ width:"auto", template:"#name#" },
							select:true
						},
						{ // to the third row we put form with 3 text input fields and 1 button
							view:"form", id:"myform", data:[
								{ type:"text", label:"Name", id:"name"},
								{ type:"text", label:"Age",  id:"age"},
								{ type:"text", label:"City", id:"city"},
								{ type:"button", label:"Save", click:"save_form"}
							] 
						}
					]
				});
 
				var dp = new dhx.DataProcessor({
					master:$$('mylist'),
					url:"validate.php"
				});
				dp.link($$('myform'));
				dp.attachEvent("onAfterInvalid", function(result){
					dhx.notice(result.value);
				});
 
			});
 
 
			function add_item(){
				$$('mylist').add({},1);
			};
			function remove_item(){
				$$('mylist').remove($$('mylist').getSelected());
			};
			function save_form() {
				this.save();
			};
 
		</script>
	</body>
 
</html>