ASP.net & JQuery

24
1

Transcript of ASP.net & JQuery

1

ASP.NET & JQuery Una pareja explosiva Leandro Masotti Technical Leader

Gonzalo PrezMicrosoft MVP ASP/ASP.NET www.chalalo.cl

AgendaIntroduccinOverview de JQuert Por que deberamos usar JQuery Comenzando con JQuery Animaciones Demos

Jquery & ASP.NET

Hechos sobre esta unin. Microsoft Ajax Framework Instalacin y Soporte Demos, Demos, Demos.

ASP.NET & JQuery -Una pareja explosivaEscribes CSS? Desarrollas con ASP.NET? Desarrollas con Javascript? No te has olvidado del lado del cliente? Quieres escribir menos lineas de cdigo?

4

jQuery OverviewCreado por John Resig Open sourceMIT y Licencia GPL

Compatibilidad Cross-browserInternet Explorer 6+, Firefox 2+, Opera 9+, and Safari 2+

Liviano y Agil15KB

Utilizado por la mayora de los grandes WebSitesBank of America, Dell, Netflix, NBC _

Apoyada fuertemente por la comunidad

Por que deberamos usar JQuery?JQuery hace la tarea de escribir cdigo javascript mucho ms fcil! Navegacin DOM (css-like syntax) Aplicar mtodos a elementos DOM Builder Model (Mtodos encadenados) Extensible con muchas libreras soportado por la mayor parte de los navegadores

6

Comenzando con JQuerySelectoresPodemos seleccionar un elemento del DOM $("#miObjetoDOM").css("border", "solid 2px navy"); o seleccionar por la clase CSS (.): $(".alternante").css("background", "lightsteelblue ");

Podemos seleccionar elementos con filtros de tipo , y atacharle funciones javascript asociados a un evento de manera sencilla y rpida $("input:button ").click(function(event) { alert("hola mundo"); });Un ejemplo ms complejo sobre seleccionar todas los registros de una tabla $("#gdEntries>tbody>tr").css("border", "solid 1px red");

7

Comenzando con JQueryEncadenamiento?$("a) .filter(".clickme") .click(function() { alert("Estas abandonando este sitio"); }) .end() .filter(".hideme") .click(function() { $(this).hide(); return false; }) .end();8

Comenzando con JQueryDEMO 1 (Selector a DOM) DEMO 2 (Selector a CSS) DEMO 3 (Encadenamiento)

9

Animaciones con JQueryBsicas$().show() $().hide() $().slideDown() $().slideUp() $(..).fadeIn $(..).fadeOut() muchos Plugins.

10

Animaciones Bsicas con JQueryDEMO Animaciones

11

JQuery & ASP.NET

La Unin hace la Fuerza

12

JQuery & ASP.NETHechosMicrosoft no es dueo de JQuery JQuery se incluye bajo licencia MIT Microsoft contribuye activamente con JQuery Microsoft Proveer soporte total(7/24) Microsoft integrar por defecto JQuery en las versiones siguientes de VStudio Ya Incluido en ASP.NET MVC 1.0 Microsoft Provee Intellinsense for JQuery

13

Microsoft AJAX FrameworkASP.NET AJAXAJAX Requests Selectors

Components and ControlsClient Templates AJAX Control Toolkit

Animations

Plugins

14

JQuery & ASP.NETEs parte de Microsoft Ajax Framework Potencia la programacin Client-Side Permite mejorar el comportamiento de controles. Muy til con los ClientTemplates de ASP.NET 4.0 Permite invocar WebServices de manera liviana Permite invocar WebMethod de manera liviana Y mucho ms

15

Que necesito para Instalar el Sorporte?ScottGu, jQuery Intellisense in VS 2008http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs2008.aspx

Tener Instalado VS2008 sp1 KB958502-JScript Editor support for -vsdoc.js IntelliSense documentation fileshttp://code.msdn.microsoft.com/KB958502/Release/ProjectReleases.aspx?Releas eId=1736

16

JQuery & ASP.NET DEMO WebControls

17

JQuery & ASP.NETDEMOLlamar a WS JQUERY (JSON) Llamar a WebMethod en aspx (JSON)

18

JQuery & ASP.NETDEMOClientTemplates (ASP.NET 4.0)

19

Referenciashttp://jquery.com/Scott Guthries blog: http://weblogs.asp.net/scottgu/ Rick Strahls blog: http://www.west-wind.com/weblog/

Book: jQuery in Action

20

21

22

Recursos para los desarrolladores

http://microsoft.com/spanish/msdn/latam/mediacenter/Microsoft MSDN Latinoamrica te ofrece los ltimos recursos multimedia en espaol para desarrolladores: presentaciones y demostraciones en directo o diferido, va Internet, brindadas por expertos de Microsoft, las cuales te ayudarn a mantenerte al da con informacin sobre los productos y tecnologas que utilizas a diario en el desarrollo de tus aplicaciones.

Leandro [email protected] | http://www.accendra.com

Gonzalo Prez [email protected] | http://www.chalalo.cl

2008 Microsoft Corporation. Todos los derechos reservados. Microsoft, Windows, Windows Vista y otros nombres de producto son y pueden ser marcas registradas y registros en Estados Unidos y en otros pases. La informacin contenida en el presente es slo para fines informativos y representa la visin actual de Microsoft Corporation a la fecha de esta presentacin. Debido a que Microsoft debe responder a las cambiantes condiciones del mercado, no se debe interpretar como un compromiso por parte de Microsoft, y Microsoft no puede garantizar la precisin de ninguna informacin provista despus de la fecha de esta presentacin. MICROSOFT NO OFRECE GARANTA ALGUNA, EXPRESA, IMPLCITA O DE LEY, RESPECTO A LA INFORMACIN EN ESTA PRESENTACIN.

24