Substituto para ALERT() JavaScript

[lucashp]

Ola, estou fazendo um formulário de cadastro que á  (foreign key) é o CPF , então assim que o usuario tenta cadastrar com um CPF ja ultilizado aparecerar a seguinte mensagem :

 

function alertacpf(){
alert("CPF já cadastrado!");
};

Gostaria de um substituto para esta mensagem ela não é nem um pouco bonita , e o usuário precisa clicar em "OK" , tenho conhecimento básico em PHP,JQUERY e JAVASCRIPT. 

[Marcelo Perrella]

Olá. Você possui conhecimento de HTML? JavaScript é uma linguagem de programação feita para trabalhar lado a lado com o HTML. O JavaScript possui muitas funcionalidades na hora de manipular o DOM, e manipular o DOM certamente será a melhor substituição para esse alerta. Caso não conheça HTML, recomendo dar pelos menos uma rápida estudada, especialmente se estará utilizando javascript.

 

Respondendo à sua pergunta, sim, existem alternativas melhores, mais bonitas e mais elegantes, que envolvem manipular o DOM.

 

Imagine que você possui esta tag <p> no seu HTML, com o id "cpf".

<p id="cpf"></p>

Você pode então manipular este elemento da seguinte forma:

function alertacpf() {
	// Retorna o objeto referente ao elemento da DOM que possui o id "cpf".
	let node = document.getElementById("cpf");

	// Agora que você possui o objeto, você pode manipular-lo desta forma:
	node.textContent = "CPF já cadastrado!";
}

 

E agora você pode facilmente estilizar esse elemento utilizando CSS, outra linguagem de marcação que é um dos pilares da tecnologia web juntamente ao HTML e JS. Um exemplo de estilização:

#cpf {
	font-family: sans-serif, "Trebuchet MS";
	font-size: 10em;
	color: red;
}

 

A ideia básica é essa, com um pouco mais de conhecimento de HTML, CSS e JS, você pode criar soluções muito mais limpas e eficientes, como ligar e desligar uma classe no elemento do DOM que irá esconder ou não a frase "CPF já cadastrado!", por exemplo.

[lucashp]

Ola, nao consegui executar este comando , não acontece nada 

[Marcelo Perrella]

Olá. Por favor, você poderia tirar uma ou duas horinhas do seu dia para estudar HTML? Isso vai te ajudar bastante. Vai ser realmente complicado te ajudar se você continua tentando copiar o código sem tentar entender o que ele significa

[DiF]

@lucashp Um Outro jeito de substituir o alert é usar a técnica ajax para fazer a requisição assíncrona dos dados que você quer e inserir via javascript jQuery no elemento desejado.

[Marcelo Perrella]

24 minutos atrás, DiF disse:

@lucashp Um Outro jeito de substituir o alert é usar a técnica ajax para fazer a requisição assíncrona dos dados que você quer e inserir via javascript jQuery no elemento desejado.

Eu acho que esse é o problema. Ele não sabe manipular o DOM usando JS ou jQuery :/

[DiF]

@Marcelo Perrella Sem problemas, basta ele tirar uma ou duas horas e estudar isso.

O nosso papel aqui não é dar a resposta pronta, mas sim dar um norte. 

Como exatamente você e eu fizemos.

 

Existem, muitos sites que podemos recomendar a ele como o W3school, Codeacademy, CODEpen e dentre outros.