Mostrando postagens com marcador JavaScript. Mostrar todas as postagens
Mostrando postagens com marcador JavaScript. Mostrar todas as postagens

terça-feira, 6 de outubro de 2009

Campo Número Decimal

Bom, esse post vai ser outro daqueles "coisas que ainda vou precisar, novamente"!

Esse script javascript serve para deixar o campo com uma máscara de campo decimal (ex: 99,00) conforme você vai digitando. Isso associado à CSS com text-align right, deixa bonitinho =)

Normalmente eu utilizo o plugin maskedinput para o jQuery, mas ele só trabalha com tamanhos fixos de campos, e por isso esse scritp abaixo:

Segue o script utilizado:


// Parametros: campo, separador_de_milhar, separador_decimal, evento
function maskCurrency(fld, milSep, decSep, e) {
var sep = 0;
var key = '';
var i = j = 0;
var len = len2 = 0;
var strCheck = '0123456789';
var aux = aux2 = '';
var whichCode = (window.Event) ? e.which : e.keyCode;
if (whichCode == 13 || whichCode == 8 || whichCode == 0) return true;
key = String.fromCharCode(whichCode);// Valor para o código da Chave
if (strCheck.indexOf(key) == -1) return false; // Chave inválida
len = fld.value.length;
for(i = 0; i < aux =" '';" len =" aux.length;" len ="=" value =" '';" len ="=" value =" '0'+" len ="=" value =" '0'+"> 2) {
aux2 = '';
for (j = 0, i = len - 3; i >= 0; i--) {
if (j == 3) {
aux2 += milSep;
j = 0;
}
aux2 += aux.charAt(i);
j++;
}
fld.value = '';
len2 = aux2.length;
for (i = len2 - 1; i >= 0; i--)
fld.value += aux2.charAt(i);
fld.value += decSep + aux.substr(len - 2, len);
}
return false;
}

Quando quiser utilizar isso num campo, altere a tag alt com o valor monetario (ex: alt="monetario"), e utilize o seguinte script (em jquery) abaixo:


$(document).ready(function(){
$('input[alt="monetario"]')
.bind('keypress', function(e) { return maskCurrency(this, '', '.', e)})
.css("text-align", "right");
});


E apenas para constar, esse scriptzinho que quebra um galho também (self-explanatory):

function sonumeros(e) {
var whichCode = (window.Event) ? e.which : e.keyCode;
if( whichCode!=8 && whichCode!=0 && (whichCode<48>57)) {
return false;
}
}

terça-feira, 17 de julho de 2007

A re-Introduction to JavaScript

Como vi no blog do Guilherme Chapiewski (oh nomezinho difícil de escrever=] ), resolvi postar aqui também este link para um ótimo artigo sobre JavaScript.

Como JS está muito em alta hoje, ele tem grandes chances de perder a má fama que ganhou ao longo dos anos, e pra quem tem estudado e aplicado ele hoje em dia, tem se surpreendido com o seu poder, e o pensamento mais comum é: "Bah! E isso sempre existiu!"

Então pra quem é desenvolvedor web, esta é uma leitura essencialmente obrigatória.

Um link interessante ainda para dar uma olhada é o da especificação da linguagem JavaScript pela ECMA.

Valeu =)

quinta-feira, 12 de julho de 2007

Funcionalidade de Thread/Timer em JavaScript

Bom, digamos que o título não está exatamente bom, mas não consegui pensar em nenhum melhor =/

Ontem estava precisando fazer um lance parecido com o "Thread.sleep(numero);", ou melhor, acho que era mais parecido com o "Timer.schedule()", porém em JavaScript, e lembrei do tal conhecido método setTimeout(). Ele funciona, de uma maneira simplificada, assim:


<>
<>
var contador=0;
function testeTimeout()
{
document.getElementById('contador').innerHTML = contador++;
setTimeout('testeTimeout()',1000);
}
< /script>

< onload="testeTimeout()">
< id="contador">
< /div>
< /body>
< /html>


O que ele faz é "agendar" a execução do método passado no primeiro parametro, depois do tempo setado (que é em milisegundos) no segundo parametro. Ou seja, no exemplo acima ele iré executar o metodo testeTimeout(), e irá "agendar" uma próxima execução deste método para daqui a 1 segundo.

Um exemplo prático do uso disso seria fazer um agendamento de processamento de método (function) javaScript, para por exemplo, ficar fazendo um pooling via ajax em um determinado Serviço publicado pelo Application Server.

Outro aspecto interessante ainda sobre essa função é:
"Ela é blocante ou não?"
A resposta para esta pergunta é NÃO. Existem 2 situações onde ela poderia bloquear:
ter mais instruções no método logo abaixo da chamada de setTimeout
chamar outro método através de um evento qualquer por intervensão do usuário por exemplo.

Segue abaixo um exemplo para comprovar os dois exemplos. O timeout agora foi setado para 10 segundos para que seja possível a interação do usuário (clicar no botão):

<>
<>
var contador=0;
var contador2 =0;
function testeTimeout()
{
document.getElementById('contador').innerHTML = contador++;
setTimeout('testeTimeout()',10000);
for(i=0; i<10; i++)
{
contador2++;
document.getElementById('contador2').innerHTML =
document.getElementById('contador2').innerHTML+' '+contador2;
}
}

function alerta()
{
document.getElementById('contador2').innerHTML = 'outra função';
alert('teste');
}
< /script>

< onload="testeTimeout()">
< id="contador">
< /div>
< id="contador2">
< /div>
< type="button" value="Alerta" onclick="alerta()">
< /body>
< /html>


Concluindo, você pode, por exemplo, deixar um "serviço em background" na sua aplicação e ele não irá interferir no funcionamento geral, dentre outras inúmeras funcionalidades.

------
Pode até não ser tão grande novidade, mas agora quando precisar algo já tenho os exemplos prontos aqui (o que é uma coisa que normalmente perco) =)