jQuery Ketchup Plugin - Documentation

Ketchup is a small (3.4KB minified & gzipped) jQuery Plugin that helps you to validate your forms. Out of the box it has 18 basic validations and a bubble like style. But truly this Plugin wants to be hacked to fit your needs. Default Behavior If you like the style of the bubbles and all validations you need are already included you can get this Plugin up and running like so: Your HTML Header Include the default stylesheet (located in . <! Your HTML By default Ketchup checks the data-validate attribute of form fields if it can find matching validations. Your Javascript Just call ketchup() on your form, voilà. $('#default-behavior').ketchup(); Declare fields to validate in the call In last version Ketchup checked the class attribute for validations... which was not everyones taste because class should be used for defining CSS classes. Note that required is not a validation declaration but an actual class name. Right after the options (empty here {}) we pass in an object. Included Validations
Building Real-Time Form Validation Using jQuery
Client-side validation is something every web form should have, no doubts about that. While server-side validation does its job, it certainly lacks good user experience. What is so great about client-side validation then? Not only is it useful to the user because it makes the process of filling out the form a lot quicker and a lot less painful, but it also shows that you actually care about them. In this tutorial we’re going to learn how to build real-time form validation using jQuery. Table of Contents How Will We Achieve That? Now, there are actually many ways to do that; here are the most common: It will all work, but neither is the optimal way. It’s clearly not the way to go, so instead we’re going to do this the way I do it myself. OK, so what are we going to do? That way we keep our HTML code nice and clean. Note: It’s vital to always provide server-side validation as well (for users with turned off JavaScript). Project Structure We are going to need three files: Coding the HTML jVal
jQuery.validity Guide & Documentation
Table of Contents: Introduction: jQuery.validity is a plugin designed to aid in the configuration of clientside form-validation. Validity was concieved with three goals: Easy Setup: Validity employs the principle of Convention Over Configuration to aid in keeping code manageable and semantic. In style, validity makes use of jQuery's selector engine and follows its pattern of method chaining. Setup: In order to use Validity on a page, you will need to import the jQuery JavaScript library as well as jQuery.validity itself. As a simple example suppose we start with the following HTML document with a simple form: <html> <head> <title>Simple</title> </head> <body> <form method="get" action="simple.htm"> Number of Vehicles: <input type="text" id="vehicles" name="vehicles" title="Vehicle Count" /> <br /><br /> Date of birth: <input type="text" id="dob" name="dob" title="Birthday" /> <br /><br /> <input type="submit" /> </form> </body></html> Let's say that we want to require both of the fields. usd
Tag "jQuery" on Smashing Coding
Useful JavaScript Libraries and jQuery Plugins For Web Developers
Advertisement If you have a problem and need a solution for it, chances are high that a JavaScript library or jQuery plugin exists that was created to solve this very problem. Such libraries are always great to have in your bookmarks or in your local folders, especially if you aren’t a big fan of cross-browser debugging. A JavaScript library isn’t always the best solution: it should never be a single point of failure for any website, and neither should a website rely on JavaScript making the content potentially inaccessible. In this two-part overview, we feature some of the most useful JavaScript and jQuery libraries which could be just the right solutions for your common problems. Due to the length of this post, we’ve split it into two parts for your convenience: Quick Overview: Below you’ll find a brief overview and links to the libraries and tools featured in this post. Web Forms and Input Validation Select2 jQuery PluginA jQuery-plugin for replacement and enhancement of <select>-boxes.
Documentation - Leaflet
API Reference This reference reflects Leaflet 0.7. Docs for 0.6 are available in the source form (see instructions for running docs). Map The central class of the API — it is used to create a map on a page and manipulate it. Usage example Creation Options Map State Options Interaction Options Keyboard Navigation Options Panning Inertia Options Control options Animation options Events You can subscribe to the following events using these methods. Methods for Modifying Map State Methods for Getting Map State Methods for Layers and Controls Conversion Methods Other Methods Locate options Zoom/pan options Pan options Zoom options fitBounds options The same as zoom/pan options and additionally: Properties Map properties include interaction handlers that allow you to control interaction behavior in runtime, enabling or disabling certain features such as dragging or touch zoom (see IHandler methods). map.doubleClickZoom.disable(); You can also access default map controls like attribution control through map properties:
noty - A jQuery Notification Plugin
Hi! noty is a jQuery plugin that makes it easy to create alert - success - error - warning - information - confirmation messages as an alternative the standard alert dialog. Each notification is added to a queue. (Optional) The notifications can be positioned at the: top - topLeft - topCenter - topRight - center - centerLeft - centerRight - bottom - bottomLeft - bottomCenter - bottomRight The API provides lots of other options to customise the text, animation, speed, buttons and much more. It also has various callbacks for the buttons such as opening and closing the notifications and queue control. Layouts & Demos Top Alert Success Error Warning Information Confirm TopLeft Alert Success Error Warning Information Confirm TopCenter Alert Success Error Warning Information Confirm TopRight Alert Success Error Warning Information Confirm CenterLeft Alert Success Error Warning Information Confirm Center Alert Success Error Warning Information Confirm Installation Try!
Related:
Related: