ASP.NET Tutorial 5

Espero que tenham acompanhado os guias anteriores e que os tenham percebido, hoje, neste tutorial vou-vos falar de jQUERY – a nova coqueluche para desenvolvimento de aplicações WEB.

null

O que é?

jQuery é uma biblioteca Open Source de javascript muito leve, rápida, intuitiva e que rapidamente (nasceu em 2006) se tornou numa das mais populares bibliotecas para programar na WEB.

Com esta biblioteca melhoramos e simplificamos de forma significativa a interacção entre Javascript e HTML. Outra das suas grandes vantagens é ser compatível com todos os Browsers existentes.

Em muito menos linhas de código conseguimos obter resultados que em Javascript dariam para preencher várias folhas A4.

Uma das principais características é o facto de podermos encadear comandos.

O slogan é “Write less, do more”.

Selectors?

Como o nome indica servem para seleccionar um elemento da DOM para assim poder ser manipulado.

Existem várias formas de chegar a um elemento:

1. $(document);
Procura um objecto DOM (neste caso o document)
2. $(’#mydiv’)
Procura um div que tenha o id “mydiv”
3. $(’p.first’)
Procura todas as tags < p > com a classe “first”.

jQuery e ASP.NET?

Em 2008 e pela primeira vez a Microsoft adoptou e distribuiu na sua Framework uma biblioteca Open Source. Esta união trouxe grandes benefícios aos developers ASP.NET que assim passam a ter intellisense de jQUERY no Visual Studio e as novas versões do ASP.NET AJAX vão passar a utilizar jQUERY.

Utilização?

Para utilizar a biblioteca basta fazer o download da ultima versão de jQUERY e adicionar o script no header da nossa página:

A sintaxe começa sempre com o símbolo $ (dólar) que é uma função para o objecto jQUERY.

$(document).ready(function()
 {
 alert('Hello World');
 });

$(document).ready()
Esta é a função que é chamada quando o documento foi carregado. Tem como argumento uma função anónima (muito utilizado em jQUERY) que é chamada depois de carregar o documento

$(“div”).css(“border”,”9px solid red”);
Nesta função procuramos todos os div aplicamos um estilo em que a border ficará com a cor vermelha.

$(“#myDiv”).css(“border”,”3px solid red”);
Nesta função procuramos um div com o id “myDiv” e aplicamos um estilo em que a border ficará com a cor vermelha.

PageMethods por jQUERY:

Code-Behind:

public partial class _Default : Page
{
[WebMethod]
public static string GetDate()
{
return DateTime.Now.ToString();
}
}

jQUERY:

$.ajax({
type: "POST",
url: "Default.aspx/GetDate",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
alert(msg.d);
}
});

WebServices por jQUERY:

$.ajax({
type: "POST",
url: "NomeWebService.asmx/método",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
alert(msg.d);
}
});

O funcionamento é igual a um PageMethod a única diferença é no url, em que colocamos o nome do webservice e o método ao invés do nome da página e o método.

Conclusão:

Depois de muitos anos no esquecimento o código do lado do cliente voltou em grande força, sendo um dos grandes impulsionadores o Ajax. Desde o seu regresso muitos criaram formas de melhorar a escrita de código em Javascript mas o jQUERY é de longe a melhor biblioteca para desenvolver, fácil, intuitiva, prática e muito poderosa esta biblioteca vai ajudar-nos a criar sites muito dinâmicos. A inclusão na Framework .NET vem a facilitar ainda mais a sua utilização.

Por hoje é tudo, para a semana iremos começar a desenvolver o nosso site para um clube de vídeo.

nullLinks: jQUERY and Microsoft
nullHomepage: jQUERY





  •   
  •   
  •  
  • Pin It  
  • Imprima este artigo
  • Post2PDF


11 Comentários

  1. jQuery é mt prático, utilizo bastante em php.

  2. jeitasso era em basic 2008 e restantes haver formas mais simples de identificar campos em partes do website em vez de ter de fazer parses pelo ficheiro. quando em VB se encontra uma TEXTAREA ele bloqueia todo um gajo fica ali parado e tem de andar a engendrar mil e uma coisas para poder dar a volta ao problema, muitas vezes acabando por andar a procura de tags no source do html em vez de poder utilizar as funçoes normais do webbrowser.
    tarda nada mudo-me mesmo para .net

  3. lol
    Eu pensava que o jQuery era só para javascript. :D

  4. Bom tutorial. Antes fugia do ASP mas agora já gosto dele.

    Porque é que existe censura no Pplware? É que o meu comment anterior foi retirado. Que vergonha

    • Sá,

      Censura não temos. O que temos é quem leia todos os comentários e que não permite certos e determinados comportamentos.

      Pesa o que escreveste e vê se se enquadra no que é esperado dos leitores do Pplware.

      Como não sei o que escreveste vou averiguar e tentar saber ao certo o que foi.

      Tens a certeza que não era ofensivo ou provocatório?

    • :D essa não entendi. Então o que teria o comentário para o anti-spam o abater?

      Podes repetir o que estava escrito?

      É que não temos por hábito censurar comentários, isso dá uma trabalheira!!! :P

      Deixa-te disso, foi algum motivo ou bug que “limpou” o teu comment. Podes sempre repetir.

      Cumprimentos.

  5. Olá,

    Deixava uma sugestão para estas sempre interessantes rúbricas sobre de programação. Que tal uma abordagem à programação baseada em sistemas open source?(Qt com C++ ou java, etc.) ou então para sistemas móveis (maemo, android, etc.)?

    Abraço e votos de continuação do bom trabalho.

  6. Muito bom!
    Dá muito jeito ter isso sempre “à mão” :)
    A combinação de .NET com a biblioteca jQUERY é muito boa, permitindo fazer muitas coisas que separadamente seria muito complicado.

    Bom tutorial Henrique Graça, continua ;)

Deixe o seu comentário

Aviso: Todo e qualquer texto publicado na internet através deste sistema não reflete, necessariamente, a opinião deste site ou do(s) seu(s) autor(es). Os comentários publicados através deste sistema são de exclusiva e integral responsabilidade e autoria dos leitores que dele fizerem uso. O autor deste site reserva-se, desde já, o direito de excluir comentários e textos que julgar ofensivos, difamatórios, caluniosos, preconceituosos ou de alguma forma prejudiciais a terceiros. Textos de caráter promocional ou inseridos no sistema sem a devida identificação do seu autor (nome completo e endereço válido de email) também poderão ser excluídos.