Connect With WRD
feed via e-mail
feed via e-mail

Archive for the ‘Forms’ Category

Almost every website needs a form. Whether it is for asking visitors to contact you, an online job application or an event registration.

Also, forms need to be secure, user-friendly and the data collected must be reachable for analyzing/responding easily.

Ajax Form Pro, a professional and downloadable PHP application, which was featured before, now has a new version with more features and they are giving away 3 Developer licenses ($67/each) and offering a 20% discount to WRD readers.

Joining the giveaway is so easy, details are mentioned at the bottom of this and here is more information about the app:

Ajax Form Pro Admin Interface

The application has an administration panel for creating a form with:

  • any input types (including file uploads)
  • settings like the text to be displayed (or redirection to any URL) after submission, if the contents of the form will be e-mailed to anyone..
  • custom styling and layout
  • captcha enabled or not

and allows us to integrate it into web pages either with the generated PHP code or via an iframe.

Form can be styled either with the settings provided or using a custom CSS for advanced/complete styling.

Ajax Form Pro - Sample

It is created with usability in mind; the validator is real-time, works as-you-type, forms degrade gracefully for users without JavaScript and an option exists for displaying them inside a lighbox (so you can provide a link to anything which will display the form without leaving the page).

To sum up, Ajax Form Pro is a so useful application not only for creating secure forms but also for keeping/reaching the data collected in a single, organized interface.

A discount for WRD Readers

Ajax Form Pro is offering a 20% discount to WRD readers with the coupon code AFPWRD (which is valid for the next 2 weeks).

Here are the shortcuts to the pages for using the coupon codes:

How to join the giveaway?

In order to get a chance win one of the 3 Developer Licenses, simply comment to this post and winners will be selected randomly with the query below on 8 February 2012 (1 week later):

SELECT * FROM wp_comments WHERE comment_post_id=2779 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 3

Good luck to everyone.

The winners

Here they are:

  • Kunule (comment #506883)
  • Leon (comment #506936)
  • chromus (comment #506748)

Congratulations and thanks very much for joining.

TextExt is a feature-rich jQuery plugin for improving the functionality of text input fields.

The plugin is modular, can be extended easily and has features like tag inputs, filtering, auto-complete, placeholder text and Ajax (which are all plugins of TextExt).

jQuery TextExt Plugin

It can also display a custom arrow besides select fields, show the items in them as suggestions-while-typing and more.

TextExt is very well-documented, regularly improved and has too many examples to start with.

Validate.js is a very nice JavaScript form validation library that is inspired from the CodeIgniter form validation API.

The library is lightweight (~1kb gzipped), doesn't require any JavaScript frameworks and works in all major browsers (yes, including IE6).

Validation rules that are used frequently like numeric, required, e-mail, less/greater than, etc. are already included and it can be extended with new, custom rules.

Validate.js

It has support for chainable declarations for easily using multiple rules on a single input field.

And, although there are hard-coded warning messages for each rule, they can be overridden with a method provided.

Almost every website uses forms to collect information from users: contact forms, newsletter subscriptions, order forms and many others.

Although creating forms isn't the most difficult task for a web designer/developer, styling them, handling the submissions securely and tracking the submissions can be tricky and time-consuming.

123ContactForm Logo123ContactForm, an impressive web-based form builder application which eases creating and managing forms so much for everyone, is giving away 3 Yearly Platinum licenses ($300 value/each) to WebResourcesDepot readers.

Details on joining the giveaway can be found at the bottom of this post and here is more information about this exciting application:

What is 123ContactForm?

It is a feature-rich web app that makes creating, customizing and consuming any type of forms (simple to advanced) possible.

123ContactForm

Besides standard forms, it has support for creating various special ones like:

  • order forms with payment integration (PayPal, Google Checkout or Authorize.net)
  • surveys for collecting data from a given group
  • event registration with a integrated map

And, there is a templates collection that includes many pre-defined forms like donation form, job application, sales lead, etc. to quickly building them.

123ContactForm has a slick interface with drag 'n' drop support where form fields of any type are easily added or removed.

The look and feel of the output can be selected from a theme gallery or changed/improved by adding custom CSS rules. Also, it is possible to present the same form in multiple languages.

123ContactForm Themes

How forms will behave during the submission can be completely controlled as well with options like:

  • e-mails to be notified, if the page will be redirected to a URL
  • using a captcha or not, blocking any IPs or countries, password protection of forms

Once a form is created, it can be published in many different ways:

  • linking to the form
  • embedding via JavaScript or iframe
  • displaying inside a Lightbox
  • Facebook integration, WordPress plugin and Blogger or Google Sites support

And, you can always track the submissions for each forms, their statistics from a user-friendly dashboard.

The application also integrates well with many other popular apps like Google Docs, MailChimp or SalesForce

To sum up, 123ContactForm is a very good solution for instantly and securely collecting data from web users.

How to join the giveaway?

In order to get a chance to win one of the 3 Yearly Platinum licenses, please mention "what you liked the most about 123ContactForm after trying it" in the comments and winners will be selected randomly using the query below on 25 Oct 2011 (a week later) as an update to this post.

SELECT * FROM wp_comments WHERE comment_post_id=2525 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 3

Good luck everyone.

Winners (updated on 25 Oct 2011)

Here are the winners of 123ContactForm giveaway:

  • Sam (comment #414089)
  • wites (comment #414574)
  • Jose Adan Ortiz (comment #414002)

Congratulations and thanks very much to everyone for joining.

Daniel Raftery of ThrivingKings, a talented web developer, has created and sharing various useful jQuery plugins.

One of them is Formly, a plugin for easily adding cross-browser styling and validation to forms.

Another one is Sticky which enables us to create good-looking notification messages on any corner of a web page. They can be set to auto-close and multiple messages can be displayed at the same time.

jQuery Plugins by ThrivingKings

There is Apprise, a simplistic modal box plugin for displaying alert-like dialogs. It has built-in options to show verification, confirmation and text alerts. Also, these alerts can be set to appear with an animation.

And, the last one is Badger which is a pretty original plugin that can insert a chic badge on any part of an HTML element. The badges can contain any text and a nice way of getting the user's attention and providing information.

Mobiscroll is a "wheel scroller user control" optimized for touchscreens to easily enter date and/or time which comes as a jQuery plugin.

It is highly customizable where values can be anything (including images) and can even be used as an alternative to the default select control (dropdown list).

The plugin's look can be changed easily with theming support and has ready-to-use good-looking skins (default, Android, Sense UI and iOS).

And, it integrates well with other JS frameworks including jQuery Mobile.

Mobiscroll jQuery Plugin

Ideal Forms is a lightweight framework, built on the top of jQuery, for creating good looking and user-friendly forms.

It converts standard <input> elements into ones with rounded corners having an attractive focus effect. And, radio + checkbox elements are completely customized.

No images are used, they requires minimal HTML syntax and can be completely styled with CSS (comes with 3 themes).

The framework is unobtrusive and degrades gracefully with JavaScript disabled.

jQuery Ideal Forms

ExColor is a jQuery plugin for enabling users to select colors from a Photoshop-like color picker.

It is attached to <input> fields and can be activated by simply calling a single-line function.

The color picker's design is so flexible as every element used in the picker comes with 10 different design options to select from.

Also, a web-based editor helps choosing each design element, their colors and various other options to create a unique look.

jQuery ExColor Color Picker Plugin

Combogrid is a jQuery plugin for adding advanced auto-complete functionality to input fields.

As the user types, it displays the list of possible results dynamically inside a paginated grid interface.

Requests are sent via Ajax and results are returned in JSON (or JSONP for cross-domain requests) datatype.

jQuery Combogrid Plugin

There are many options provided like the ability to setup alternate row colors, auto-choosing the result that matches the query, minimum length of the text before the grid is activated and more.

Also, it is ThemeRoller-ready and there is keyboard support for navigating through the items.

Flexi is a lightweight (4.3kb) color picker that doesn't use any images (thanks to SVG/VML), CSS or 1px hacks but only JavaScript.

It is a standalone script that doesn't require any JavaScript frameworks and can pass the color selected in hexadecimal, HSV and RGB formats.

The dimensions, position of the picker and slide area can be fully customized in CSS just like any other div element.

Flexi Color Picker

Uptime Robot
feed-holder
FeedBurner
HotScripts Marketplace
PSD2HTML.com