Duplicidade na importação

Você deve fazer uma consulta no SQL antes de cada insert pra ver se não existe aquele registro repetido na tabela. Por exemplo se vou inserir camiseta, azul na tabela antes pergunto ao banco de dados "select * from roupas where tipo='camiseta' and cor='azul'". Se o atributo EOF dessa consulta for true aí sim você pode dar o insert.

Obrigado pelo auxílio André. Porém via banco de dados eu sei fazer. Queria uma alternativa direto na programação via Javascript.

Pensei em criar uma tag do tipo no html com incremento automatico e uma condição para a verificação no javascript . Só não sei se é possível, sabe se tem como?

Obrigado.

Você pode fazer ao clicar no botão ele fique inativo. Assim não daria pra clicar duas vezes. Não acho legal colocar os dados na página de forma oculta usando display:none no style do span pois dando um refresh se perde os dados ou então teria que carregar toda a tabela ocultamente na página toda vez que ela carregasse.

Gionani, tudo certo?

Cara, eu tive o mesmo pensamento. E tentei fazer uma validação bem simples, e aparentemente funcionou.

No arquivo Buscar-Pacientes.js eu criei uma nova variável na primeira linha do arquivo:

var jaBaixou = false;

Essa variável, me diz se os pacientes ja foram baixados do site. Por enquanto esta como false. No IF dentro do evento do Botão, vejo se como esta a variável :

if (xhr.status == 200 && !jaBaixou) {

Para melhorar a mensagem de erro, no else deste IF, coloquei da seguinte forma:

if (jaBaixou) {
                console.log("Os pacientes ja foram importados!");
            } else {
                console.log("Erro ao carregar paciente");
                console.log(xhr.responseText);
            }

Eu resolvi desta forma, não é muito elegante, mas ficou legal :-)

Código inteiro:

var jaBaixou = false;
var botaoAdicionar = document.querySelector ("#buscar-pacientes");

botaoAdicionar.addEventListener("click", function(event){

    var xhr = new XMLHttpRequest();

    xhr.open("GET", "https://api-pacientes.herokuapp.com/pacientes");

    xhr.addEventListener("load", function(){

        if (xhr.status == 200 && !jaBaixou) {
            var resposta = xhr.responseText;
            var pacientes = JSON.parse(resposta);

            pacientes.forEach(function(paciente) {
                adicionaPacienteNaTabela(paciente);            
            }); 

            jaBaixou = true;
        } else {

            if (jaBaixou) {
                console.log("Os pacientes ja foram importados!");
            } else {
                console.log("Erro ao carregar paciente");
                console.log(xhr.responseText);
            }
        }

    })

    xhr.send();
});