Simple Auto-Complete For Forms

Form auto-completing feature is seen on many websites like Gmail, Yahoo and more.

Auto-completing makes inputting experience easier & faster for the user. On the other hand it is very helpful for the standardization of content, keywords, tags, etc. It may prevent a user wrongly writing Mcrsoft rather than Microsoft for example.

Form Auto Complete

Auto Complete Control is a javascript script which offers a simple to use solution.

It is not an Ajax, dynamic-keywords script. The keywords which will be shown while filling the form are defined staticly.

Auto Complete Control has some nice features like defining “delimiters” which makes it easier to use for “tag inputs”. And it can be styled so easily.


How To Use Auto Complete Control?

Firstly, include the .js file into your script:

Next, create an array (in JavaScript) containing the keywords:

customarray = new Array(‘apple’,’pear’,’mango’,’pineapple’,’orange’,’banana’,’durian’, ‘jackfruit’,’etc’);

Apply the widget to your textbox using JavaScript:


And you’re done!


Ajax Live Form Validation With LiveValidation

Validating forms as users type is a nice feature for users, it lets them see when they make a mistake.

An ajax live form validation library, LiveValidation is not only a form validation library, it can also be used for other types of validations.

Ajax Live Form Validation

The naming conventions and parameters of the validations are similar to those found in the Ruby on Rails framework, and as such is the perfect client-side companion. Don’t worry if you dont use Ruby on Rails though, LiveValidation can be used anywhere you like, is simple to learn, and a joy to use.

LiveValidation has standalone and prototype.js versions for download.

Asp.Net Ajax Auto-Complete Control Like Google Suggest

This Asp.Net Ajax Auto-Complete Control which is created by Matt Berseth works similar to Google Suggest.

After you start typing the keyword, Asp.Net Ajax AutoComplete Control starts to offer you results from the dataset and when the keyword is typed results are filtered according to the keyword.

Ajax Auto Complete Asp.Net

Code uses AjaxControlToolkit’s AutoComplete extender for suggesting the values.

Stylish Checkboxes And Radio Buttons Using FancyForm

Styling checkboxes & radio buttons to give them a look other than standard forms can be a key to impress site visitors.

Using FancyForm, which is a powerful checkbox replacement script used to provide the ultimate flexibility in changing the appearance and function of HTML form elements, gives very nice looking form outputs.

FancyForm is very quick to setup (only two lines of markup needed), extendible and will degrade if viewed from an older browser.

Nice Looking Checkbox Radio Button

P.S. FancyForm uses the ultra-lightweight Mootools JavaScript framework (Mootools is included with the download).

Dynamic Form Autocomplete (Facebook Style)

Dynamic form autocomplete code, named TextboxList, is built on Mootools javascript framework and works just like the Facebook form inputs that are very functional.

Dynamic Form Autocomplete

TextboxList works by caching all the results from a JSON Request and feeding them to the autocompleter object. When an item is added as a box, it’ removed from the feed array, and when the box is disposed it’s added back, so that it becomes available in the list when the user types.

This dynamic form autocomplete solution has a “without autocomplete” version that can be found here.