XMod Pro Module Kit - DotNetNuke Contact Us Form with jQuery Validation & Messaging
As an example kit to show off the flexibility of XMod Pro templates when creating module items for DotNetNuke like a contact form or feedback form, we have put together an example using the
jQuery Validation Engine.
Module Description:
While everyone loves the easy-to-use, built-in validation and messaging that is default in XMod Pro when working with forms, we sometimes get requests for examples using more advanced jQuery styles and validation.
This demo shows elements of XMod Pro and jQuery such as:
- XMod Pro Form Elements - TextBox, DropdownList, TextArea
- XMod Pro TextArea form element displays available character countdown and max limit
- Fieldset and Legend form markup / structure
- Enhanced jQuery popup validation
Uses:
Use this as a base code to create your own customized form module by adding in your questions and form fields, or use it as a resource for tips and tricks for building your own XMod Pro solution!
- contact us form module
- user feedback module
- questionnaire forms
- information / inquiry form
- email signup form (mailing list & newsletter signup forms)
- online survey form
- polls
- download request form
- application form
- order form
- customer support form
- data collection form
XMod Pro Module Kits: Notes & Instructions
- XMod Pro demos and XMod Pro Module Kits are free for everyone to use! We have developed them to help share popular items and to help train users in the features and functionality of XMod Pro for creating custom module solutions for DotNetNuke!
- To utilize this XMod Pro demo, simply download the Module Kit from the DNNDev Downloads section. Once you've downloaded the file, install it as you would any DNN module. Next, add the kit module to a page. Finally, click the module's "Finish Installation" button to complete the process. The result will be an XMod Pro module instance, configured to use the kits forms, templates, and feeds as needed.
- This kit utilizes a custom XMod Pro Form combined with code and files from the jQuery form validator from www.position-relative.net.
- There are no images - all look and feel is CSS driven. You may also download the full js from the source at github - jQuery Validation Engine, as well as read up on additonal tags, validations and options that are available when using this jQuery plugin.
- Additionally, the clean style and layout design for this form utilizes the smart advice for form styling from AListApart, Pretty Accessable Forms.
- The jQuery involved is compatible with all modern web browsers and with jQuery versions 1.4.4+.
- This XMod Pro Module Kit features a demo Form that you can connect to your custom database fields.