10 интеллектуальных способов использования [FORM] Элементы

10 интеллектуальных способов использования [FORM] Элементы

Когда вы сочетаете изящную функциональность, любезно предоставленную PHP, с хитростью javascript, вы можете получить довольно умные результаты, используя

элементы для создания изящных эффектов, компонентов и плагинов, все они высочайшего качества и более или менее легко настраиваются. Попробуйте.

1. Создание динамического опроса с помощью jQuery и PHP

В этом руководстве вы узнаете, как создать опрос с помощью PHP и XHTML, а затем использовать некоторые эффекты jQuery Ajax, чтобы устранить необходимость в обновлении страницы и придать ей небольшую анимацию.



Эта форма пока будет обрабатываться PHP, а когда мы запустим Javascript, jQuery. PHP и Javascript предназначены для извлечения идентификатора опции из тега значения.

Посмотреть демо

2. FancyUpload — Swiff встречает Ajax (v3.0)

FancyUpload — это замена файлового ввода с ненавязчивым меню выбора нескольких файлов и загрузкой в ​​очередь с анимированным индикатором выполнения. Его легко настроить, он независим от сервера, полностью настраивается с помощью CSS и XHTML и использует MooTools для работы во всем.

 
File Upload

This form is just an example fallback for the unobtrusive behaviour of FancyUpload.
If this part is not changed, something must be wrong with your code.


Check out the demo

3. Fancy Capatcha

Ajax Fancy Captcha is a jQuery plugin that helps you protect your web pages from boys and spammers in a new, intuitive way of completing “verify humanity” tasks. In order to do that users are asked to drag and drop specified item into a circle.

The code calls captcha.php file and gets a random number. Php file just generates simple number and put it in session. When AJAX got that number it creates items based on that number. Lets imagine that we have array of “pencil”, “scissors”, “clock”, “heart”, “note”, so if number 3 is returned it will take “heart” and look for item-heart.png file in /imgs directory.

Check out the demo

4. TextboxList

TextboxList turns normal textboxes into a widget which can be navigated with the keyboard, effectively turning your input into a “list” of items that can be easily deleted. It comes with an Autocomplete plugin.

Check out the demo

5. jQuery UI Slider from a Select Element

The plugin uses progressive enhancement to replace an already-functional HTML select element with a jQuery UI slider control, and adds a number of features for both visual users and those on assistive technologies.

Check out the demo

6. jQuery Password Strength Meter

Password Strength Meter is a jQuery plug-in that provides a smart algorithm that shows the strength of the input.

Check out the demo

7. jQuery Keypad

A jQuery plugin that attaches a popup keyboard to a text field for mouse-driven entry or adds an inline keypad in a division or span. It can display the letters/numbers randomized which is a very effective security solution against key loggers.

Check out the demo

8. jquery.timepickr

jquery.timepickr was created in a attempt to make the process of inputing time in a form as easy and natural as possible. Using it is so simple, you just need to call the timepickr function with the id of the form.

$(function(){
    $('#test-1').timepickr({
        handle: '#trigger-test'
        convention: 12 });
});

Посмотреть демо

9. Спеллифицировать

Spellify — это основанная на script.aculo.us программа проверки орфографии для полей форм, которая использует Google в качестве механизма проверки орфографии. PHP 4+ с установленной библиотекой CURL, script.aculo.us и Prototype JavaScript Framework.

Посмотреть демо

10. Создайте чат с помощью PHP и AJAX

Узнайте, как создать динамический чат на основе ajax с помощью jQuery с нуля. Будет очень интересно узнать, как использовать функцию ajax jQuery и как ее можно использовать для вставки и восстановления данных из базы данных MySQL через PHP асинхронно.

Посмотреть демо