Grouping Field Sets on Dynamic Web Forms with the Ext JS Framework
In the first part of this series, I showed you how to build a simple dynamic web form with the Ext JS framework. The form performed basic client-side validation on some of its fields. In this second part of a five-part series, I'm going to show you how to build a more complex form with this framework, capable of more sophisticated behavior.
Grouping Field Sets on Dynamic Web Forms with the Ext JS Framework - The application’s full source code (Page 4 of 4 )
As I expressed in the section that you just read, below I listed the complete source code that builds the previous dynamic web form, in this case embedded into a single (X)HTML file. Here it is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
// display dynamic web form comprised of two field sets
fieldsetForm.render(document.body);
});
</script>
</head>
<body>
<h1>Simple Form with two Field Sets</h1>
</body>
</html>
Here you have it. That’s all the source code that you need to build the dynamic web form shown in the previous section. Naturally, in this case I included all of the CSS and JavaScript dependencies bundled with the Ext JS package, so remember to download these additional files when testing this example on your own machine.
Final thoughts
In this second chapter of the series, I walked you through the development of a dynamic web form whose input boxes were neatly laid out by using two field sets. As you saw for yourself, this process was simplified by the excellent JavaScript API provided by the Ext JS library.
In the upcoming tutorial, I’ll show you how to use the Ext JS package to create a multi-column web form that will incorporate a full-featured HTML editor. Now that you know what the next tutorial will be about, you don’t have any excuses to miss it!
DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.
JavaScript 
Constructing a Multi-Column Online Form with the Ext JS Framework
