Publicidade

ukow

Validação de campo Cartão de Crédito

cartão de credito
Patrocínio:

Olá!

Estou tentando montar um campo para validação de cartão de crédito e sua bandeira; acabei encontrando o seguinte código: http://jsfiddle.net/q0x3ksv3/

Funciona perfeitamente nessa URL, porém quando tento incluí-lo no meu site, não funciona, tem algo faltando? Segue meu código para entenderem melhor:

<script>
var cartoes = {
    visa: /^4[0-9]{12}(?:[0-9]{3})/,
    mast: /^5[1-5][0-9]{14}/,
    amex: /^3[47][0-9]{13}/,
	invalidos: /^[0126789]|^5[06-9]{1}|^3[1235689]/
};

document.getElementById('num').addEventListener('keyup', testarCC);
var inputs = document.querySelectorAll('.fsResDir input[type="radio"]');

function testarCC(e) {
    var nr = this.value;
    var tipo;
    for (var cartao in cartoes) if (nr.match(cartoes[cartao])) tipo = cartao;
    if (tipo) document.getElementById(tipo).click();
    else for (var i = 0; i < inputs.length; i++) inputs[i].checked = false;
}
</script>
<fieldset class="fsResDir">
    <legend>Dados do Cartão&nbsp;</legend>
    <input type="radio" name="RadBand" id="visa" />
    <label for="visa">
        <img src="visa.png" />
    </label>
    <input type="radio" name="RadBand" id="mast" />
    <label for="mast">
        <img src="master.png" />
    </label>
    <input type="radio" name="RadBand" id="amex" />
    <label for="amex">
        <img src="amex.png" />
    </label>
    <label for="val" class="lab90">Validade:</label>
    <input type="text" class="ent20Form" id="val" name="TxtValMes" />/
    <input type="text" class="ent40Form" name="TxtValAno" />
    <label for="num" class="lab90">Numero:</label>
    <input type=text class="ent120Form" id="num" name="TxtNumero" />
    </div>
</fieldset>

Obrigado!

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

Dá uma olhada nesta biblioteca https://github.com/stripe/jquery.payment 

 

Ela valida e também retorna qual o cartão baseado na numeração informada

1

Compartilhar este post


Link para o post
Compartilhar em outros sites
4 minutos atrás, Michel Wilhelm disse:

Dá uma olhada nesta biblioteca https://github.com/stripe/jquery.payment 

 

Ela valida e também retorna qual o cartão baseado na numeração informada

 

Ele validou certinho, mas o que preciso é como o exemplo do post, que a bandeira do cartão seja informada automaticamente na tela após o preenchimento, e nessa biblioteca preciso dar uma ação pra isso :/

0

Compartilhar este post


Link para o post
Compartilhar em outros sites
12 minutos atrás, ukow disse:

 

Ele validou certinho, mas o que preciso é como o exemplo do post, que a bandeira do cartão seja informada automaticamente na tela após o preenchimento, e nessa biblioteca preciso dar uma ação pra isso :/

var cartoes = {
    visa: /^4[0-9]{12}(?:[0-9]{3})/,
    mast: /^5[1-5][0-9]{2}/,
    amex: /^3[47][0-9]{2}/
};




function testarCC(e) {
		var inputs = document.querySelectorAll('.fsResDir input[type="radio"]');
    var nr = this.value;
    var tipo;
    console.log(nr);
    for (var cartao in cartoes) {
    
    	if (nr.match(cartoes[cartao])) {
      	tipo = cartao;
      }
    }
    
    if (tipo) {
	    document.getElementById(tipo).checked=true
    }
    else {
    	for (var i = 0; i < inputs.length; i++) {
      	inputs[i].checked = false;
      }
    };
}

document.getElementById('num').addEventListener('keyup', testarCC);

Veja se é mais ou menos isso. Eu testei digitando "5162" que é o inicio de muitos masterscard, ai selecionou automaticamente o radio

0

Compartilhar este post


Link para o post
Compartilhar em outros sites
5 minutos atrás, Michel Wilhelm disse:

var cartoes = {
    visa: /^4[0-9]{12}(?:[0-9]{3})/,
    mast: /^5[1-5][0-9]{2}/,
    amex: /^3[47][0-9]{2}/
};




function testarCC(e) {
		var inputs = document.querySelectorAll('.fsResDir input[type="radio"]');
    var nr = this.value;
    var tipo;
    console.log(nr);
    for (var cartao in cartoes) {
    
    	if (nr.match(cartoes[cartao])) {
      	tipo = cartao;
      }
    }
    
    if (tipo) {
	    document.getElementById(tipo).checked=true
    }
    else {
    	for (var i = 0; i < inputs.length; i++) {
      	inputs[i].checked = false;
      }
    };
}

document.getElementById('num').addEventListener('keyup', testarCC);

Veja se é mais ou menos isso. Eu testei digitando "5162" que é o inicio de muitos masterscard, ai selecionou automaticamente o radio

 

 

Estou testando nesse domínio alternativo: http://divinho2.web2420.uni5.net/pag.asp

 

O código da tela ficou esse abaixo, mas continua sem dar retorno algum.

O que é estranho, o código no jsfiddle está funcionando tranquilo, precisa de algum plugin ou algo do tipo?

Obrigado!

<script type="text/javascript">
var cartoes = {
    visa: /^4[0-9]{12}(?:[0-9]{3})/,
    mast: /^5[1-5][0-9]{2}/,
    amex: /^3[47][0-9]{2}/
};




function testarCC(e) {
		var inputs = document.querySelectorAll('.fsResDir input[type="radio"]');
    var nr = this.value;
    var tipo;
    console.log(nr);
    for (var cartao in cartoes) {
    
    	if (nr.match(cartoes[cartao])) {
      	tipo = cartao;
      }
    }
    
    if (tipo) {
	    document.getElementById(tipo).checked=true
    }
    else {
    	for (var i = 0; i < inputs.length; i++) {
      	inputs[i].checked = false;
      }
    };
}

document.getElementById('num').addEventListener('keyup', testarCC);
</script>
<fieldset class="fsResDir">
    <legend>Dados do Cartão&nbsp;</legend>
    <input type="radio" name="RadBand" id="visa" />
    <label for="visa">
        <img src="visa.png" />
    </label>
    <input type="radio" name="RadBand" id="mast" />
    <label for="mast">
        <img src="master.png" />
    </label>
    <input type="radio" name="RadBand" id="amex" />
    <label for="amex">
        <img src="amex.png" />
    </label>
    <label for="val" class="lab90">Validade:</label>
    <input type="text" class="ent20Form" id="val" name="TxtValMes" />/
    <input type="text" class="ent40Form" name="TxtValAno" />
    <label for="num" class="lab90">Numero:</label>
    <input type=text class="ent120Form" id="num" name="TxtNumero" />
    </div>
</fieldset>

 

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

Joga o script abaixo do HTML. Pode ser bobo, mas abre o console javascript do browser para ver se emite algum erro, mas acredito que já viu isso

1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Realmente era isso hahaha

Obrigado Michel! Deu certo :D

1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!


Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.


Entrar Agora

  • Próximos Eventos

  • Conteúdo Similar

    • Por Kaio Nascimento
      Boa tarde galera, minha primeira vez aqui hehe, to montando uma aplicação que precisa retornar dados via json pro front, e pra fazer isso, durante a consulta de informações, eu crio uma array com os valores e antes de retornar dou um json_encode nela, porém não ta dando certo. alguém pode me dar um help?
       
      Essa é a posição 0 de 9 da array gerada (visualizada por var_dump):
       
      [0]=> array(4) { ["codigo"]=> int(13) ["nome"]=> string(18) "EDITALN02-PETSAUDE" ["titulo"]=> string(36) "EDITAL COORDEP - N 02/2016 Pet Saúde" ["descricao"]=> string(586) "é simplesmente uma simulação de texto da indústria tipográfica e de impressos, e vem sendo utilizado desde o século XVI, quando um impressor desconhecido pegou uma bandeja de tipos e os embaralhou para fazer um livro de modelos de tipos. Lorem Ipsum sobreviveu não só a cinco séculos, como também ao salto para a editoração eletrônica, permanecendo essencialmente inalterado. Se popularizou na década de 60, quando a Letraset lançou decalques contendo passagens de Lorem Ipsum, e mais recentemente quando passou a ser integrado a softwares de editoração eletrônica como Aldus PageMaker." }
       
      Depois de montar essa array, eu faço isso:
       
      return json_encode($this->array_editais);
    • Por Fagner Dos Santos
      Amigos, estou com um sério problema com json2.asp
      Estou usando ele pra listar uma paginação de um webservice.
      Ele lê normalmente a página 1, mas quando o WHILE passa pra pagina 2 ele me retorna um erro
      Acredito que seja alguma coisa no sentido de zerar o Objeto Json mas não estou sabendo como fazer.

       
      Erro de tempo de execução do Microsoft VBScript erro '800a01b6' O objeto não dá suporte para a propriedade ou método: 'parse' api_sms/grava_extrato_sms.asp, linha 93 paginas=2 conta = 0 webservice_url = "https://api.directcallsoft.com/extrato/list-sms" do while conta <= paginas conta = conta + 1 resultado = "" arrmsg = "" mensagens = "" response.write "conta: " & conta response.write "," '===== CONSULTAR SMS set Xml = Server.Createobject("MSXML2.ServerXMLHTTP") Xml.open "POST", webservice_url, false Xml.setRequestHeader "content-type", "application/x-www-form-urlencoded" Xml.send("access_token="&tokenSMS&"&formato=json&dataInicial="&dataAnterior&"&dataFinal="&dataAtual&"&pagina=" & conta) resultado = Xml.responseText Set json = JSON.parse(resultado) mensagens = json.msg arrmsg = split(mensagens, ",") for i=0 to ubound(arrmsg) response.write "conta_for: " & i response.write "," callerid = json.msg.get(i).callerid cliente = json.msg.get(i).cliente status_sms = json.msg.get(i).status_sms callerid = json.msg.get(i).callerid custo = json.msg.get(i).custo uuid_origem = json.msg.get(i).uuid_origem response.write callerid response.write "," next loop set Xml = Nothing set json = Nothing  
    • Por renanqueiroz12@bol.com.br
      Não sei como passar da linguagem que a gente faz na mão para a Java. O exercício é:
      "Faça um algoritmo que inverta os valores de um vetor de inteiros de 20 posições do início para o fim. O vetor a ser invertido deve primeiramente ser lido do teclado."
      Fiz assim:
      Algoritmo ____
      Início
      Tipo Ex01 = Vetor [1...20] de inteiros;
      Inteiros: Vet
      Para I de 1 até 20 passo 1, faça
      leia(vet);
      fimpara;
      Para I de 20 até 1 passo 1 faça
      Vet2[J] <- vet ;
      j <- j +1;
      fimpara;
      fim.
    • Por Pitag346
      Olá pessoal, beleza?
       
      estou com um problema... tenho uma requisição json, ou seja um api... que encontra-se assim: (exemplo)
      {"4460961":[{"name":"Urgot's Shadowdancers","tier":"SILVER","queue":"RANKED_SOLO_5x5","entries":[{"playerOrTeamId":"4460961","playerOrTeamName":"Bonbonha","division":"IV","leaguePoints":3,"wins":90,"losses":83,"isHotStreak":false,"isVeteran":false,"isFreshBlood":false,"isInactive":false}]},{"name":"Jax's Crusaders","tier":"SILVER","queue":"RANKED_FLEX_SR","entries":[{"playerOrTeamId":"4460961","playerOrTeamName":"Bonbonha","division":"V","leaguePoints":62,"wins":69,"losses":68,"isHotStreak":false,"isVeteran":false,"isFreshBlood":false,"isInactive":false}]}]} Como podem ver, os índices se repetem... ou seja estão com os índices duplicados e os valores estão diferentes de cada um...
      gostaria de separa-los, então utilizei:
      foreach($obj2 as $key => $value){ $tier = $value[0]['tier']; $rank = $value[0]['division']; } o único erro retornado é: Notice: Undefined index: division ... mas o division está definido na API ... 
      não sei oque fazer, e não sei porque não está reconhecendo o indice => "division" ... mas o indice => "tier" está funcionando normal...
       
       
      Espero que ajudem-me...
      Agradeço desde já!
    • Por Pitag346
      Olá pessoal, beleza ?
      estou com um problema em uma solicitação utilizando um API...
      segue o código (PHP):
      <?php $apiKey = ''; $summonerName = $_GET['i']; $result = file_get_contents('https://br.api.pvp.net/api/lol/BR/v1.4/summoner/by-name/'.$summonerName.'?api_key=' . $apiKey); $summoner = json_decode($result)->$summonerName; ?> <h3> <image height="64" width="64" src="http://avatar.leagueoflegends.com/br/<?php print $summonerName; ?>.png" valign="middle"/> <?php print $summonerName ?> </h3> <div> Level: <?php print $summoner->summonerLevel; ?> </div> <?php $result = file_get_contents('https://br.api.riotgames.com/api/lol/BR/v1.3/stats/by-summoner/' . $summoner->id . '?api_key=' . $apiKey); $stats = json_decode($result); foreach($stats->playerStatSummaries as $statSummary){ $losses = property_exists($statSummary, 'losses')? $statSummary->losses : '(not available)'; print '<p><b>' . $statSummary->playerStatSummaryType . '</b>: ' . $statSummary->wins . ' wins, ' . $losses . ' losses</p>'; } ?> estou com problema, utilizei esse código mas esta retornando esse erro:
       
      Warning: file_get_contents(https://br.api.riotgames.com/api/lol/BR/v1.3/stats/by-summoner/?api_key=************): failed to open stream: HTTP request failed! HTTP/1.1 403 Forbidden in get.php on line 28
       
      não sei oque está dando de errado....
      se alguém puder me ajudar com esse API
      (O api é da riot games desenvolvedora do jogo League of Legends)
       
      Obrigado desde já! 
      att