Aprendendo JQuery - PARTE 1

Baixe a biblioteca

Coloque em uma pasta do seu projeto
e adiciona a seguinte linha no cabeçalho da sua página

<script type="text/javascript" src="jquery/jquery-1.3.2.min.js"></script>

em src você coloca a pasta/jquery-1.3.2.min.js

Logo abaixo da linha declarada insira o seguinte script

<script type="text/javascript">

$(document).ready(function() {

});

</script>

é dentro de $(document).ready que seu código deve ser inserido

insira o seguinte código html na sua página

Nome <input type="text" id="txtNome"><p>
<input type="button" value="enviar" id="btnEnviar">
não esqueça de prencher o id no campo e no
botão é através dele que definiremos os eventos

no script inclua o seguinte código

$("#btnEnviar").click(function(){
});
neste trecho estamos definindo um evento de click para o botão
definindo o mesmo pelo o id $("#btnEnviar")

no seu evento insira

var nome = $("#txtNome").val();

com essa linha pegamos o valor do campo de texto

para testarmos podemos colocar o nome para ser
exibido em um alert
alert(nome);


Ler Tudo

JAVA - Convertendo uma Lista de Objetos para JSON e retornando pelo servlet

Bem, essa foi umas das coisas que passei um tempão fuçando para poder descobrir junto com meu colega Rafael, até que hoje conversando com ele achei possíveis soluções, e para minha felicidade não é que uma delas deu certo ?

 Então vamos por a mão na massa :)

 Usando a lib do Google Gson que nos possibilita de fazer isso.



//Setamos o tipo do response para application/json 
response.setContentType("application/json");
 
PrintWriter out = response.getWriter(); 

//Aqui eu declaro a lista e populo a mesma, no meu caso estou pegando
//de um método que tenho na fachada
List<Funcionario> funcionarios = new ArrayList<Funcionario>();
funcionarios.addAll(fachada.pesquisarFuncionario("FROM Funcionario")); 
//Essa lista receberá todos os objetos convertidos em JSON
List<String> gsonSTR = new ArrayList<String>();
 
// Declaramos um foreach para iterar sobre a lista
for (Funcionario funcionario : funcionarios) {
gsonSTR.add(gson.toJson(funcionario));
}

Ler Tudo
, ,

JQuery - AJAX e o método load()

O método load veio para facilitar a vida do desenvolvedor, eu mesmo já usei muito para soluções onde queria deixar o código mais limpo...

 Temos um simples exemplo de como utilizá-lo:


Segundo a documentação do pessoal do jquery a sintaxe é $("url parametros, callback");
  • url: A URL que é solicitada a requisição.
  • parâmetros: Um objeto cuja propriedades são serializadas em uma série de parâmetros codificados corretamente e que se passam a requisição. Se utilizado, deve-se especificar se a requisição utiliza o método POST, caso contrário, se omitido, a requisição utiliza o método GET.
  • callback: Uma função chamada após a solicitação já ter sido processada.

HTML:


<html>

<body>

<div id="divPrincipal">

<span>Conteúdo</span>

</div>

<button id="btnEnviar">Enviar</button>

</body>

</html>

Exibição:

Conteúdo

Javascript:


$("#btnEnviar").on("click",function(){

$("#divPrincipal").load("http://suaurl.com");

});


Explicação:

Ao clicar no botão enviar é disparado o evento de clique dizendo que na divPrincipal deve ser carregado esse conteúdo que seria a url, poderia ser uma ação passando parametros também :



$("#divPrincipal").load("http://suaurl.com?acao=login");

ou então se você quisesse carregar nesse div apenas uma div nessa outra página:

$("#divPrincipal").load("http://suaurl.com #div2");

E ao final de tudo adicionar uma mensagem de retorno (callback) retornando o sucesso:

$("#divPrincipal").load("http://suaurl.com #div2", function(){

alert("Sucesso!");

});
Então é isso pessoal, espero que tenham gostado ! :)

 Fonte: Pinceladas da Web, JQuery

Ler Tudo

Eventos on() e off() - Jquery

Pessoal, hoje vim falar dos eventos on e off que são de grande utilidade na vida do desenvolvedor. O evento  on foi atualizado no Jquery 1.7 e funciona do mesmo modo que o .bind(), .delegate(), e .live(), acho que o pessoal do Jquery o criou para acabar com essa confusão de vários eventos com a mesma finalidade.

O evento on()

Digamos que queremos adicionar um evento a um botão, quando o mesmo for clicado será exibido um alerta informando o seu id, o que temos a fazer é adicionar o evento on que vai capturar o clique do botão e executar a função informada.

$("#botao").on('click', function(){
   alert("O id do botão é: "+$(this).attr('id'));
});

O evento off()

A função do off é nada mais que remover o evento, no nosso caso vamos remover o evento de clique no botão.

$("#botao").off("click");

Então o evento é removido e ao ser clicado nada irá acontecer.

Então é isso pessoal, dúvidas? sugestões ? Deixem nos comentários! :)

Ler Tudo 0 comentários

Category

Category

  • (1)
  • (1)
  • (1)
  • (1)
  • (1)
  • (1)

Category

Category