Outils pour utilisateurs

Outils du site


informatique:javascript:jquery

JQuery

Tips

Promise & Deferred

Synchroniser plusieurs appel Ajax :

 // un tableau pour ranger tous les appels ajax
 var calls = new Array();
 $(someArray).each(function(idx, item)
 {
  calls.push( $.get( {url:'/page/'+$(item).attr('data-name'), context:{item:item}})
   .done(function( data ) {
    $(this.item).html( data );
   }));
 });
 // utilise apply() pour transformer le tableau "calls" en liste d'arguments pour la fonction "when()"
 $.when.apply( null, calls )
 .then( function(){
  // All jobs done
 });

Plugins

jQuery Plugins (by malsup): BlockUI Plugin, Corner Plugin, Cycle Plugin, Feed Plugin, Form Plugin, HoverPulse Plugin, Media Plugin, Taconite Plugin, Twitter Search Plugin.

SimpleModal

http://www.ericmmartin.com/projects/simplemodal/

SimpleModal is a lightweight jQuery Plugin which provides a powerful interface for modal dialog development. Think of it as a modal dialog framework. SimpleModal gives you the flexibility to build whatever you can envision, while shielding you from related cross-browser issues inherent with UI development.

jQuery-Validation-Engine

Jeditable

http://www.appelsiini.net/projects/jeditable

Edit In Place Plugin For jQuery.

$(document).ready(function() {
     $('.edit').editable('http://www.example.com/save.php');
});

jQuery Treeview

Upload File

hayageek jQuery Upload File - jQuery File UPload plugin provides Multiple file uploads with progress bar. jQuery File Upload Plugin depends on Ajax Form Plugin, So Github contains source code with and without Form plugin.

Blueimp jQuery-File-Upload - File Upload widget with multiple file selection, drag&drop support, progress bar, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.

handsontable

https://handsontable.com/

Rock-solid data grid for web applications. A JavaScript component that combines data grid features with spreadsheet-like UX.

Dual licences: non-commercial / commercial

DataTables

http://www.datatables.net/

DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table. Key features:

  • Sorting, type detection, API functions, pagination and filtering
  • Display data from almost any data source. DOM, Javascript array, Ajax file and server-side processing (PHP, C#, Perl, Ruby, AIR, Gears etc). Ajax auto loading of data
  • Rock solid - backed by a suite of 1400+ unit tests. It's free!
  • Wide variety of plug-ins: TableTools, FixedColumns, KeyTable and more via extensive plug-in support
  • State saving. Dynamic creation of tables. Custom DOM positioning. Non-destructive DOM interaction
  • Fully themeable by CSS
$(document).ready(function() {
  $('#theTable').dataTable();
});

Accordion

http://jqueryui.com/demos/accordion/

If you want multiple sections open at once, don't use an accordion !

An accordion doesn't allow more than one content panel to be open at the same time, and it takes a lot of effort to do that. If you are looking for a widget that allows more than one content panel to be open, don't use this. Usually it can be written with a few lines of jQuery instead, something like this:

jQuery(document).ready(function(){
	$('.accordion .head').click(function() {
		$(this).next().toggle();
		return false;
	}).next().hide();
});

Or animated:

jQuery(document).ready(function(){
	$('.accordion .head').click(function() {
		$(this).next().toggle('slow');
		return false;
	}).next().hide();
});
informatique/javascript/jquery.txt · Dernière modification : 13/05/2021 13:05 de cyrille

Sauf mention contraire, le contenu de ce wiki est placé sous les termes de la licence suivante : CC0 1.0 Universal
CC0 1.0 Universal Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki