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

quarta-feira, 1 de maio de 2013

Usando AJAX com ASP - [ComboBox | DropDownList | Select ]

Em ASP (Active Server Pages) o uso do AJAX (Asynchronous JavaScript e XML) serve para realizarmos processamentos em paralelo em outra página ASP, ou seja, a partir de uma página ASP usando AJAX iniciar um processamento de outra pagina ASP na qual o resultado é redirecionado para página chamadora.

Vemos na imagem abaixo:

Para o uso do AJAX que é um JavaScript Assíncrono, devemos utilizar um objeto JavaScript chamado XMLHttpRequest;
Temos no trecho de código abaixo que o JavaScript irá realizar [ xmlhttp.send(); ] uma requisição usando Assíncrona com POST de um processamento que ocorrerá na página "Processa.asp" [ xmlhttp.open("POST","Processa.asp",true); ].
Ao término do processamento [ xmlhttp.onreadystatechange...com...(xmlhttp.readyState==4 && xmlhttp.status==200) ]é recomentado realizar alguma ação com base no resultado [ xmlhttp.responseText ] do processamento.


var xmlhttp;
//Criando o Objeto AJAX
if (window.XMLHttpRequest){
    //IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}else{
    // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

//Quando terminar o processamento
var resultado = "";
xmlhttp.onreadystatechange = function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        resultado = xmlhttp.responseText;
    }
};

//Chamada do processamento Assíncrono
xmlhttp.open("POST","Processa.asp",true);
xmlhttp.send();

Antes de realizarmos o carregamento de uma combo precisamos saber o que escrever de código na nossa página Processa.asp de modo que a variável resultado contenha alguma informação;
A resposta é simples: Tudo que for escrito através de [ Response.write ];

Neste exemplo temos no html do asp a seguinte estrutura:


    Estados do Sul do Brasil: <select id='selUFSul' name='selUFSul'></select>

E em nossa página ASP Processa.asp o seguinte trecho

    //Pagina Processa.asp
    Reponse.Write "<option value=PR>Paraná</option>" 
    Reponse.Write "<option value=SC>Santa Catarina</option>" 
    Reponse.Write "<option value=RS>Rio Grande do Sul</option>" 
Em resumo quando AJAX chama a pagina Processa.asp, tudo que é armazenado em memória do buffer (Response.Write) é capturado por xmlhttp.responseText onde esse dado pode ser uma estrutura html podendo o programador popular com combo select conforme codigo abaixo:

xmlhttp.onreadystatechange = function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        resultado = xmlhttp.responseText;
        documento.getElementById('selUFSul').innerHTML = resultado;
    }
Enfim teremos a combo populada.

segunda-feira, 15 de abril de 2013

Javascript: Validar Data no Formato DD/MM/YYYY

Sempre que ao pesquisar sobre uma validação de data encontrava muito código para pouco resultado, e após algum estudo resolvi criar uma validação feita por mim, utilizei um conceito muito simples: se após converter o valor para o tipo Data e após a conversão a data ainda for a mesma, quer dizer que a conversão foi um sucesso, então sabemos que a data é válida.


//-----------------------------------------------------------------
// Entrada DD/MM/AAAA
//-----------------------------------------------------------------
function fctValidaData(obj)
{
    var data = obj.value;
    var dia = data.substring(0,2)
    var mes = data.substring(3,5)
    var ano = data.substring(6,10)

    //Criando um objeto Date usando os valores ano, mes e dia.
    var novaData = new Date(ano,(mes-1),dia);

    var mesmoDia = parseInt(dia,10) == parseInt(novaData.getDate());
    var mesmoMes = parseInt(mes,10) == parseInt(novaData.getMonth())+1;
    var mesmoAno = parseInt(ano) == parseInt(novaData.getFullYear());

    if (!((mesmoDia) && (mesmoMes) && (mesmoAno)))
    {
        alert('Data informada é inválida!');   
        obj.focus();    
        return false;
    }  
    return true;
}

Segue abaixo um exemplo de como utilizar a function:


<body>

Data: 
<input type='text' id='txtDt' name='txtDt' onblur='fctValidaData(this);'/>

</body>