50 plugins jQuery útiles para crear Formularios web | colorate colorate Blog de diseño, tecnología, programación, internet y curiosidades 50 plugins jQuery útiles para crear Formularios web 29nov2010Categoria: AJAX, DESARROLLO, JAVASCRIPT, JQUERYAutor: admin Si estas pensando crear un formulario y no te inspiras o bien no tienes muchos conocimientos de programación, este puede ser el enlace que estabas buscando. Desde noupe nos hacen una estupenda recopilación de 50 plugins jQuery útiles para mejorar los Formularios. Entre los tipos de formularios encontramos: Formularios de login Demo: Demo Formulario Login Tutorial: Formulario login Formularios de registro Enlace: Formulario de registro por pasos Formularios de contacto Enlace: Formulario de contacto Formularios de upload de archivos Enlace: Formulario updaload de archivos con jQuery Validación de formularios Demo: jQuery Form Validator Formularios filtrando caracteres Demo: Formulario con filtrado de texto Formularios autocompletar campos Demo: Autosuggest jquery plugin Posts Relacionados Deja una respuesta
"Select All" JavaScript for Forms Posting to an Array The problem that led to this snippet of code was that when posting from a form to a PHP script, you may sometimes want to have several fields with the same name and different values. For example, you might want people to be able to tick boxes to indicate which cities they have been to from a list. You would normally add "[]" to the name of the field inputs, like so: <input type="checkbox" name="cities[]" value="London"> London<input type="checkbox" name="cities[]" value="Paris"> Paris<input type="checkbox" name="cities[]" value="Berlin"> Berlin<input type="checkbox" name="cities[]" value="Madrid"> Madrid<input type="checkbox" name="cities[]" value="Rome"> Rome <input type="checkbox" name="cities[]" value="London"> London<input type="checkbox" name="cities[]" value="Paris"> Paris<input type="checkbox" name="cities[]" value="Berlin"> Berlin<input type="checkbox" name="cities[]" value="Madrid"> Madrid<input type="checkbox" name="cities[]" value="Rome"> Rome <!
Cómo validar un formulario utilizando PHP y Javascript (jQuery) Introducción: ¿Qué vamos a hacer? A día de hoy a nadie se le escapa que el Javascript está jugando un papel bastante importante en la interacción y usabilidad de los sitios web, para bien… y para mal (pero eso daría para escribir otro artículo completo). Procesos como el registro de un nuevo usuario son cada vez más interactivos y ofrecen multitud de tips / consejos, avisos y otros tipo de alertas antes de que la página se recargue al “pinchar en enviar”. Muchas de estas comprobaciones: saber si un nombre de usuario ya existe, si la contraseña cumple los requisitos, si un e-mail es correcto, etc se comprueban mediante Javascript. Así pues nosotros trataremos de validar un formulario con los siguientes campos a validar: Nombre de usuarioContraseñaE-mailSitio Web (Opcional) Los requisitos para cada campo los analizaremos con calma en los siguientes pasos del tutorial, pero como habréis visto todos serán obligatorios salvo el sitio web, que lo consideraremos opcional. Paso 1: La estructura <! <!
20 Things I Learned About Browsers and the Web IllustrationChristoph Niemann Writers/EditorsMin Li Chan, Fritz Holznagel, Michael Krantz Project CuratorMin Li Chan & The Google Chrome Team DesignFiPaul Truong DevelopmentFi Very Special Thanks To Brian Rakowski, Ian Fette, Chris DiBona, Alex Russell, Erik Kay, Jim Roskind, Mike Belshe, Dimitri Glazkov, Henry Bridge, Gregor Hochmuth, Jeffrey Chang, Mark Larson, Aaron Boodman, Wieland Holfelder, Jochen Eisinger, Bernhard Bauer, Adam Barth, Cory Ferreria, Erik Arvidsson, John Abd-Malek, Carlos Pizano, Justin Schuh, Wan-Teh Chang, Vangelis Kokkevis, Mike Jazayeri, Brad Chen, Darin Fisher, Johanna Wittig, Maxim Lobanov, Marion Fabing Nicolas, Jana Vorechovska, Daniele De Santis, Laura van Nigtevegt, Wojtek Cyprys, Dudley Carr, Richard Rabbat, Ji Lee, Glen Murphy, Valdean Klump, Aaron Koblin, Paul Irish, John Fu, Chris Wright, Sarah Nahm, Christos Apartoglou, Meredith Papp, Eric Antonow, Eitan Bencuya, Jay Nancarrow, Ben Lee, Gina Weakley, Linus Upson, Sundar Pichai & The Google Chrome Team
jQuery test // set constants var $pageheight = 189; // our single page height var $pagewidth = 146; // our single page width var $pageYpos = 0; // current Y position of our bg-image (in both pages) $(document).ready(function(){ // When the page is ready /* left page turner */ $("#leftpage").click( function() { $pageYpos = $pageYpos + $pageheight; // update Y postion $("#leftpage").css("background-position", "0px "+$pageYpos+"px");// move the background position setTimeout ('$("#flip").css("background-position", "top center");', 200); setTimeout ('$("#rightpage").css("background-position", "146px "+$pageYpos+"px");', 200); }); // close leftpage click function /* right page turner */ $("#rightpage").click( function() { $pageYpos = $pageYpos - $pageheight; // note: minus page height $("#rightpage") .css("background-position", "0px "+$pageYpos+"px"); }); // close rightpage click function }); // close doc ready
15 plugins jQuery para la manipulación de tablas 15 plugins jQuery para la manipulación de tablas 7 sep aNieto2k hace 2640 días en: ajax, javascript, Programacion, webdev Los elementos <table />, poco a poco, se están usando para lo que fueron creados, como la mejor forma de mostrar datos tabulados al usuario. Gracias a este uso, es posible usar javascript para añadirle funcionalidad a esas estáticas tablas. (Ver Imagen) Entre estos 15 plugins jQuery, seguro que encuentras algo para hacer que tus tablas de datos no sean planas y sin opciones. DataTables Permite: Edición al vueloCarga de datos con AjaxPaginaciónMultiordenación por columnasExtensible por pluginsPersonalizable por CSSIdiomatizable uiTableFilter Filtrar datos al vuelo Scrollable HTML Table Usar la estructura HTMLLimitar el alto y ancho de la tabla Tablesorter Multiordenación por columnasExtensible mediante widgets Flexigrid HeatColor Establecer rango de colores para visualizar más fácilmente resultados. JQTreeTable Mostrar datos en forma de arbol dentro de tu tabla. Ingrid jQuery treeTable
jPaginate: A Fancy jQuery Pagination Plugin jPaginate is a jQuery pagination plugin that comes with a twist: animated page numbers. The user can slide through the available page numbers by clicking or just hovering over the arrows. Shortlinks to the first and last page are available as well. You can call the plugin in the following way: $(elementID).paginate() You can configure […] jPaginate is a jQuery pagination plugin that comes with a twist: animated page numbers. $(elementID).paginate() You can configure the plugin with the following properties: View demoDownload jPaginate Message from TestkingLearn the basics of jquery using sun tutorials.
JavaScript fácil y rápido con jQuery Aunque la librería más conocida y utilizada hasta hace poco era Prototype, ha surgido una nueva librería llamada jQuery, que incluye muchas de las ideas de Prototype y a las que añade muchas otras nuevas ideas para crear una librería espectacular: muy pequeña, rápida, ligera y con cientos de utilidades. Las aplicaciones web cada vez son más complejas, ya que incorporan nuevos efectosvisuales e interacciones dinámicas (Ajax, auto-completar, drag&drop, elementos que aparecen/desaparecen, animaciones, etc.). Al mismo tiempo, el desarrollo de las aplicaciones web avanzadas es cada vez más complicado, ya que deben funcionar correctamente en al menos 5 navegadores diferentes (Internet Explorer 6 y 7, Firefox, Opera y Safari) y el tiempo de desarrollo se reduce por la necesidad continua de incluir novedades en la aplicación. Por todo ello, es imprescindible utilizar librerías JavaScript que simplifiquen el desarrollo y permitan crear aplicaciones compatibles con todos los navegadores. Con jQuery
Downloading jQuery - jQuery JavaScript Library Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidth and improves performance in production. You can also download a sourcemap file for use when debugging with a compressed file. To locally download these files, right-click the link and select "Save as..." from the menu. The jQuery 1.x line had major changes as of jQuery 1.9.0. Download the compressed, production jQuery 1.12.3 Download the uncompressed, development jQuery 1.12.3 Download the map file for jQuery 1.12.3 jQuery 1.12.3 release notes jQuery 2.x has the same API as jQuery 1.x, but does not support Internet Explorer 6, 7, or 8. Download the compressed, production jQuery 2.2.3 Download the uncompressed, development jQuery 2.2.3 Download the map file for jQuery 2.2.3 jQuery 2.2.3 release notes jQuery is registered as a package with Bower. Download the compressed, production jQuery Migrate 1.3.0