IMPORTANT: Per accedir als fitxer de subversion: http://acacha.org/svn (sense password). Poc a poc s'aniran migrant els enllaços. Encara però funciona el subversion de la farga però no se sap fins quan... (usuari: prova i la paraula de pas 123456)

jQuery is a lightweight, "write less, do more", JavaScript library.

The purpose of jQuery is to make it much easier to use JavaScript on your website.

jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.

jQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.

The jQuery library contains the following features:

  • HTML/DOM manipulation
  • CSS manipulation
  • TML event methods
  • Effects and animations
  • AJAX
  • Utilities

Instal·lació

Hi ha dos versions:

  • Producció:this is for your live website because it has been minified and compressed
  • Desenvolupament: this is for testing and development (uncompressed and readable code)

Sol ser un sol fitxer que s'ha d'importar al HTML. Si instal·leu el paquet libjs-jquery els fitxers disponibles són:

/usr/share/javascript/jquery/jquery.min.js
/usr/share/javascript/jquery/jquery.js
/usr/share/javascript/jquery/jquery.lite.js
/usr/share/javascript/jquery/jquery.pack.js

Recursos:

Manual

Cal anar a:

http://jquery.com/download/

Paquet Ubuntu libjs-jquery

Instal·lació:

$ sudo apt-get install libjs-jquery

Fitxers instal·lats:

$ dpkg -L libjs-jquery
/.
/usr
/usr/share
/usr/share/javascript
/usr/share/javascript/jquery
/usr/share/javascript/jquery/jquery.js
/usr/share/javascript/jquery/jquery.min.js
/usr/share/javascript/jquery/version.txt
/usr/share/doc
/usr/share/doc/libjs-jquery
/usr/share/doc/libjs-jquery/README.Debian
/usr/share/doc/libjs-jquery/copyright
/usr/share/doc/libjs-jquery/changelog.Debian.gz
/usr/share/javascript/jquery/jquery.lite.js
/usr/share/javascript/jquery/jquery.pack.js

URL de jquery un cop instal·lat

Cal tenir instal·lar javascript-common:


http://localhost/javascript/jquery/jquery.js

Sintaxi

La sintaxi bàsica és:

$(selector).action()

On

  • $: defineix que estem utilitzant jquery
  • selector: permet seleccionar elements HTML de múltiples formes.
  • jQuery action(): funcions predefinides que permeten realitzar accions sobre els elements.

Exemples:

$(this).hide() - oculta l'element actual
$("p").hide() - oculta tots els elements p (

) $(".test").hide() - oculta tots els elements amb class="test". $("#test").hide() - oculta tots els elements amb id="test"

NOTA: jQuery utilitza la sintaxi dels selectors de CSS

Normalment s'executa tot dins d'una funció:

 $(document).ready(function(){
 
   // jQuery methods go here...
 
 });

Això evita que el codi jQuery s'executi abans de que el document es carregi completament. Es pot utilitzar per abreviar:

$(function(){

   // jQuery methods go here...

});

Recursos:

Selectors

Esdeveniments

Exemples

Hola Mon!

El símbol:

$()

indica sintaxi Jquery. L'script el que fa és que un cop els elements DOM del document estan ready modifica el contingut del element amb id "msgid" per fer el hello World!:

<html>
<head>
<title>jQuery Hello World</title>
 
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
 
</head>
 
<body>
 
<script type="text/javascript">
 
$(document).ready(function(){
 $("#msgid").html("This is Hello World by JQuery");
});
 
</script>
 
This is Hello World by HTML
 
<div id="msgid">
</div>
 
</body>
</html>

Fer desapareixer un element al fer-hi clic

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
</body>
</html>

Recursos:

Tutorial

Jquery UI

Instal·lació

$ sudo apt-get install libjs-jquery-ui

Widget desplegable/Dropdown

Vegeu User Interface

http://www.jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins/

autocomplete

mcdropdown. Desplegable en format arbre

dependant dropdowns

image dropdown. Llistes amb una imatge/icona davant

Jquery Chosen

Aquest plugin està disponible per Jquery i Prototype i permet treballar amb uns desplegables de qualitat. Vegeu exemples de com queden els desplegables a:

http://harvesthq.github.io/chosen/

o també a:

Grocery Cruds

Per instal·lar-lo cal indicar el css, utilitzar Jquery i l'script de chosen chosen.jquery.min.js:

<link href="/App_Themes/Default/chosen.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="/Scripts/chosen.jquery.min.js" type="text/javascript"></script>

Els fitxers es podent trobar a github:

https://github.com/harvesthq/chosen

El codi Javascript és:

jQuery(document).ready(function(){
  jQuery(".chosen").chosen();
});

Escollir tots (select all) i unselect all

http://jsfiddle.net/C7LnL/1/

Form Field Change

When working with form fields, you often want to perform some behavior after a value has been selected or deselected. Whenever a user selects a field in Chosen, it triggers a "change" event* on the original form field. That let's you do something like this:

$("#form_field").chosen().change( … );

Updating Chosen Dynamically

If you need to update the options in your select field and want Chosen to pick up the changes, you'll need to trigger the "liszt:updated" event on the field. Chosen will re-build itself based on the updated content.

$("#form_field").trigger("liszt:updated");

Vegeu també:

Recursos:

Widget Multiselect

Recursos:

Widgets

Image sliders

Plugins

$ apt-cache --names-only search jquery
libjs-jquery - JavaScript library for dynamic web applications
libjs-jquery-cookie - jQuery cookie plugin
libjs-jquery-easing - jQuery Easing Plugin
libjs-jquery-event-drag - jQuery Event Drag
libjs-jquery-event-drop - jQuery Event Drop
libjs-jquery-fancybox - fancy lightbox alternative
libjs-jquery-form - jQuery Form Plugin
libjs-jquery-galleriffic - jQuery Galleriffic plugin
libjs-jquery-history - jQuery history plugin
libjs-jquery-jfeed - jQuery RSS/Atom feed parser plugin
libjs-jquery-jush - jQuery Syntax Highlighter
libjs-jquery-livequery - jQuery Live Query
libjs-jquery-meiomask - jQuery mask plugin
libjs-jquery-metadata - jQuery plugin for parsing metadata from elements
libjs-jquery-mousewheel - jQuery Mousewheel Plugin
libjs-jquery-opacityrollover - jQuery Opacity Rollover plugin
libjs-jquery-tablesorter - Flexible client-side table sorting
libjs-jquery-tipsy - jQuery Facebook-style tooltip plugin
libjs-jquery-treetable - jQuery treeTable Plugin
libjs-jquery-ui - JavaScript UI library for dynamic web applications
libjs-jquery-ui-docs - Documentation for JQuery-UI

libjs-jquery-ui

$ dpkg -L libjs-jquery-ui
/.
/usr
/usr/share
/usr/share/doc
/usr/share/doc/libjs-jquery-ui
/usr/share/doc/libjs-jquery-ui/AUTHORS.txt
/usr/share/doc/libjs-jquery-ui/copyright
/usr/share/doc/libjs-jquery-ui/README.Debian
/usr/share/doc/libjs-jquery-ui/changelog.Debian.gz
/usr/share/javascript
/usr/share/javascript/jquery-ui
/usr/share/javascript/jquery-ui/ui
/usr/share/javascript/jquery-ui/ui/jquery.effects.explode.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.fold.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.progressbar.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.drop.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.resizable.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.highlight.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.widget.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.tabs.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.transfer.js
/usr/share/javascript/jquery-ui/ui/i18n
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-eo.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-de.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-fr.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-zh-TW.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-uk.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-lv.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery-ui-i18n.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ru.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-hu.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-he.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-it.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-fr-CH.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-cy-GB.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-pt.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-kk.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-zh-HK.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-da.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-fo.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-en-AU.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-nl-BE.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sq.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ar.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-fi.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-hi.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-tr.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-fa.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sr.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-el.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-af.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-nl.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-lt.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-lb.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-no.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-es.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-zh-CN.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sk.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-th.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ar-DZ.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-et.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-rm.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-id.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-en-NZ.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ko.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-mk.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sv.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sr-SR.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-en-GB.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-cs.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-pl.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ro.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-gl.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-pt-BR.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-az.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-sl.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ja.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ms.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ca.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ta.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-bg.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-km.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-is.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-vi.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-bs.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-hr.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-hy.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-ml.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-tj.js
/usr/share/javascript/jquery-ui/ui/i18n/jquery.ui.datepicker-eu.js
/usr/share/javascript/jquery-ui/ui/jquery-ui-1.8.18.custom.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.slide.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.core.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.shake.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.autocomplete.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.clip.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.slider.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.accordion.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.mouse.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.datepicker.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.bounce.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.button.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.selectable.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.draggable.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.position.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.scale.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.pulsate.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.fade.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.sortable.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.core.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.droppable.js
/usr/share/javascript/jquery-ui/ui/jquery.effects.blind.js
/usr/share/javascript/jquery-ui/ui/jquery.ui.dialog.js
/usr/share/javascript/jquery-ui/themes
/usr/share/javascript/jquery-ui/themes/smoothness
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.accordion.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.core.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.dialog.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery-ui-1.8.18.custom.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.autocomplete.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.tabs.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.progressbar.css
/usr/share/javascript/jquery-ui/themes/smoothness/images
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-icons_cd0a0a_256x240.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_glass_65_ffffff_1x400.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_glass_55_fbf9ee_1x400.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_glass_75_dadada_1x400.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_glass_75_e6e6e6_1x400.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_flat_75_ffffff_40x100.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-icons_888888_256x240.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-icons_222222_256x240.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-bg_glass_95_fef1ec_1x400.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-icons_454545_256x240.png
/usr/share/javascript/jquery-ui/themes/smoothness/images/ui-icons_2e83ff_256x240.png
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.base.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.theme.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.all.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.datepicker.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.selectable.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.button.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.slider.css
/usr/share/javascript/jquery-ui/themes/smoothness/jquery.ui.resizable.css
/usr/share/javascript/jquery-ui/themes/base
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.accordion.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.core.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.dialog.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.autocomplete.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.tabs.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.progressbar.css
/usr/share/javascript/jquery-ui/themes/base/images
/usr/share/javascript/jquery-ui/themes/base/images/ui-icons_cd0a0a_256x240.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_glass_65_ffffff_1x400.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_glass_55_fbf9ee_1x400.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_glass_75_dadada_1x400.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_flat_0_aaaaaa_40x100.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_glass_75_e6e6e6_1x400.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_flat_75_ffffff_40x100.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-icons_888888_256x240.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_highlight-soft_75_cccccc_1x100.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-icons_222222_256x240.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-bg_glass_95_fef1ec_1x400.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-icons_454545_256x240.png
/usr/share/javascript/jquery-ui/themes/base/images/ui-icons_2e83ff_256x240.png
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.base.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.theme.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.all.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.datepicker.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.selectable.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.button.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.slider.css
/usr/share/javascript/jquery-ui/themes/base/jquery.ui.resizable.css
/usr/share/javascript/jquery-ui/jquery-ui.min.js
/usr/share/javascript/jquery-ui/css
/usr/share/javascript/jquery-ui/css/smoothness
/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui-1.8.18.custom.css
/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.min.css
/usr/share/javascript/jquery-ui/css/smoothness/images
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-icons_cd0a0a_256x240.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_glass_65_ffffff_1x400.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_glass_55_fbf9ee_1x400.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_glass_75_dadada_1x400.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_glass_75_e6e6e6_1x400.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_flat_75_ffffff_40x100.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-icons_888888_256x240.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-icons_222222_256x240.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-bg_glass_95_fef1ec_1x400.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-icons_454545_256x240.png
/usr/share/javascript/jquery-ui/css/smoothness/images/ui-icons_2e83ff_256x240.png
/usr/share/javascript/jquery-ui/jquery-ui.js
/usr/share/javascript/jquery-ui/css/smoothness/jquery-ui.css

Datatables

Vegeu Datatables

Exemple d'us i configuració d'Apache

Si està instal·lat el paquet:

$ sudo apt-get install javascript-common

Apache2 té per defecte els següent fitxer de configuració:

$ cat /etc/apache2/conf.d/javascript-common.conf
Alias /javascript /usr/share/javascript/

<Directory "/usr/share/javascript/">
        Options FollowSymLinks MultiViews
</Directory>

Que fa accesible la carpeta /usr/share/javascript des de la URL /javascript. Assegureu-vos aplicar els canvis:

$ sudo service apache2 restart

I el paquet:

$ sudo apt-get install libjs-jquery

Posa a disposició el fitxer:

http://localhost/javascript/jquery/jquery.js

Exemple CRUD amb CodeIgniter i JQuery

http://www.grocerycrud.com/forums/topic/66-es-translation-the-newbies-grocery-crud-tutorial/

Exemple TODO App

AJAX

Vegeu Jquery i AJAX

Troubleshooting. Resol·lució de problemes

Quan ajax falla es crida igualment la pàgina del link o submit (event.preventDefault())

Cal utilitzar el mètode event.preventDefault(), sinó a la que hi ha un error es passa a la següent pàgina (href del link utilitzat o el submit del formulari)

Vegeu també

Enllaços externs