background preloader

JQuery

Facebook Twitter

jQuery Learning Center. Datatable demo (Server side) in Php,Mysql and Ajax. Grid view is a very important web component in modern web. Sorting, searching, pagination is not a easy job in HTML tables. So many grid view framework out there, DataTable.js is the most popular among them. It is open source, light weighted, highly flexible and customizable, features like AutoFill, inline editor, sticky header, responsive, Supports bootstrap, foundation. In version 1.10 DataTable has changed and improved over version 1.9. An entirely new API is available in DataTables 1.10. In my blog I will try to explore datatable 1.10. So lets get started with most popular gridview framework in the planet. In basic initialization datatable provides pagination, sorting, instant searching by loading whole data records at once. First i have created a index.php, where I have written html markup and basic initialization. created a table wth id “employee-grid” containing three column “Employee name”, “Salary”, “Age”.

In firebug or any developers tools you can check sending parameters. Removing, Replacing and Moving Elements in jQuery. Home : Articles : Removing, Replacing and Moving Elements in jQuery Tutorial by Matt Doyle | Level: Beginner | Published on 8 June 2010 Categories: Learn how to use jQuery to easily remove elements from the page, replace elements, and move elements around. In Adding Elements to the Page in jQuery, you explored a number of ways to add new HTML elements — such as paragraphs and images — to a page. Removing elements from the page using the empty(), remove(), detach() and unwrap() methods Replacing elements with new elements by using the replaceWith() and replaceAll() methods, and How to move an element from one parent element in the page to another.

Once you've read this tutorial, you'll have mastered all the jQuery techniques you need to manipulate elements in the DOM. Removing elements from the page Removing everything inside an element: empty() The empty() method is the simplest way to remove content from the page. Here's an example that empties 2 div elements: <! <! Here's an example. <! <! . <! JavaScripting.com - The Database of JavaScript Libraries. Unheap - A tidy repository of jQuery plugins.

Video.js/setup.md at stable · videojs/video.js. Ion.Sound — jQuery or JavaScript plugin for playing sounds and music in browser on user actions and events. jQuery, JavaScript, Plugin, Audio, Sound, mp3, ogg, HTML5, Media. Description Ion.Sound — JavaScript-plugin for playing sounds on user actions and page events Project on GitHub. Ion.Sound freely distributed under terms of MIT licence. 25 free sounds included Today websites are full of events (new mail, new chat-message, content update etc.). Often it is not enough to indicate this events only visually to get user attention. You need sounds! This library, made for playing small sounds, will help you with this task. Supported browsers Desktop Windows, OS X, Linux: Google Chrome Mozilla Firefox Microsoft Internet Explorer 9.0+ Opera 12.16+ Safari 5.1+ (Safari on Windows requires QuickTime to play sounds) Mobile: iOS Safari and others (with some restrictions) Android Google Chrome and others (with some restrictions also) WP8 Internet Explorer More about browser support Demos ion.sound.play("beer_can_opening"); ion.sound.play("bell_ring"); ion.sound.play("branch_break"); ion.sound.play("button_click"); // etc.

Pause playback Stop playback Infinite loop Loop 5 times. Multiple Select. Multiple Select Multiple select is a jQuery plugin to select multiple elements with checkboxes :). Multiple Selected is licensed under the The MIT License. Completely free, you can arbitrarily use and modify this plugin. If this plugin is useful to you, you can give me a star, and I will do better, thanks. Current version: 1.1.0 Requirements jQuery >= 1.7.0 Features Default option allows to show checkbox.Ability to grouping elements.Supports to show multiple items in single row.Select all options.Feature to show placeholder.

Browser Compatibility IE 7+Chrome 8+Firefox 10+Safari 3+Opera 10.6+ Examples The Basics1 Multiple Select can take a regular select box like this: and turns it into: <head><link href="multiple-select.css" rel="stylesheet"/></head><body><select multiple="multiple"><option value="1">January</option> ... The Basics2 <head><link href="multiple-select.css" rel="stylesheet"/></head><body><select multiple="multiple" disabled="disabled"><option value="1">January</option> ...

The Basics3.

Slider

Maxatwork/form2js @ GitHub. Javascript library for collecting form data Example: If you have any questions/suggestions or find out something weird or illogical - feel free to post an issue. Because everything is better with jQuery, jQuery plugin added, check out jquery.toObject.js =) Details Structure of resulting object defined by "name" attribute of form fields. See examples below. This is not a serialization library. All this library doing is collecting form data and putting it in javascript object (obviously you can get JSON/XML/etc string by serializing it, but it's not an only purpose).

Usage var formData = form2object(rootNode, delimiter, skipEmpty, nodeCallback); or with jQuery plugin: var formData = $('form or form elements selector').toObject(options); Values of all inputs under the rootNode will be collected into one object (skipping empty inputs if skipEmpty not false). Objects/nested objects becomes Arrays Arrays of objects/nested objects Ruby-style notation License.

Jquery Plugins

Free jQuery Plugins and Tutorials - jQuery Script. Backstretch: a simple jQuery plugin that allows you to add a dynamically-resized background image to any page. Advertisement a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element by Scott Robbin Download Backstretch Now link to a hosted copy on cdnjs.com or download the entire project, including examples. Do you see the full-sized background image on this page? In a nutshell, that's what Backstretch does. It will stretch any image to fit the page or block-level element, and will automatically resize as the window or element size changes. Images are fetched after your page is loaded, so your users won't have to wait for the (often large) image to download before using your site. Demos Where can I get it? If you are interested in learning more about Backstretch, it's recommended that you view the project on GitHub.

Support Basic support is offered through Github's issues tracker. If you are in need of immediate support, Email Support is available for $17. Other jQuery Plugins. jQuery Plugins, jQuery Tutorials, jQuery Articles, jQuery Examples, jQuery Demos.