Help in JavaScript contact list program

Question

Help in JavaScript contact list program

Navigation

#1 by (0 votes)

0

I have to make a simple JavaScript program that will show the user's contact list and will allow it to insert a new contact, as in the image below and the description of the problem is as follows: Each contact should have a first and last name The program will handle an array of contacts and offer the user a choice of the two features:

View each contact

Quit

The program should run until the user chooses to exit. It should also use objects to manage contacts.

Two initial contacts to put in the program are: John Smith Jane Doe

I started studying JS a short time ago and I'm having a hard time knowing where to create objects and how to handle the names / surnames in the Array to show if the user chooses the list of contacts.

javascript array array-push

asked by anonymous 08.11.2018 / 18:51

1 answer

Select a radio button automatically from the value of another radio button Demo only works on JSFiddle

score 0 · Answer 1

Below is an example I took from here , it will not work here because of security issues as it is a sandbox but if you put in a local file it will work perfectly.

Take a look at the code, I know the example is quite complex for you, but it's a good way for you to exercise your ability to interpret code.

Any questions I am available, and good studies.

//contact array
contacts = [];
//construtor
function Person(firstName, lastName, contactDetails){
	this.first 		= firstName || "Entre com o primeiro nome: ";
	this.last 		= lastName || "Entre com o último nome: ";
	this.contact 	= contactDetails || "Entre com os detalhes: ";
}

function userInput( inputs ){
	for(ui in inputs){
		do{
			 var iData = prompt( inputs[ui],"");
		}while( iData.length==0);
		inputs[ui] = iData;
	}
	return inputs;
}

// Pede o pin de segurança salvo no local storage
if( !localStorage.getItem("secure") ){
	localStorage.setItem("secure",prompt("Defina um pin de segurança")); 
}


function process( fm ){
	var action = isNaN( fm ) ? fm.getAttribute("data-button") : fm;
	console.log("> "+(fm.value || fm) +" : " + action);
	switch( action - 0 ){
		case 0:// Carregamento
			if( localStorage.getItem("contacts-list") ) contacts = JSON.parse( localStorage.getItem("contacts-list"));
		break;

	case 1: // Listar contatos
		if( contacts.length ){
		for(var str="",c=0; c<contacts.length; c++){
			str += (c+1) + ".";
				for( cd in contacts[c] ){
					str += "[" + cd + "]: " + contacts[c][cd] + "\t";
				}
				str += "\r\n";
			}
		}else{
			str = "Sem registros";
		}
		target.display.value = str;
	break;

	case 2: // adiciona uma nova pessoa
		contacts.push( userInput( new Person() ) );
		process(1);
	break;

	case 3: // remove uma pessoa
			target.display.value = "É necessário permissão de admin para deletar...\r\n\r\nInsira o código\r\n";
			var code = prompt("Code");
			if(localStorage.getItem("secure")===code){
				process(1);
				var n = prompt("Insira o número do registro que você quer deletar :") - 1;
				var c = confirm("Contato: " + (n+1) +" : "+contacts[n].first+" "+contacts[n].last+"\r\n"+contacts[n].contact+"\r\nSerá removido");
				if( c ) contacts.splice( n,1);
				process(5);
			}

	break;

	case 4: // limpa a tela
			target.display.value = defaultDisplay;
	break;

	case 5: // salva 
			target.display.value = "saved";
			var save = JSON.stringify( contacts );
			localStorage.setItem("contacts-list",save); 
			process(0); // carrega os dados.
			process(1); // mostra os dados
	break;

	case 6:// Mudar o pin
		target.display.value = "Necessita login de administrador...\r\n\r\nEntre com o código\r\n";
			var code = prompt("Code");
			var str = "not ";
			if(localStorage.getItem("secure")===code){
					do{
						var a = prompt("Insira o novo pin:");
						var b = prompt("Re-digite o pin:");
					}while( a!=b);
				localStorage.setItem("secure",a);
				str = "";
				}
				target.display.value = "Pin "+str+" alterado";
	break;

	default:
			process(4); 

}

}


window.onload = function(){
	target = document.forms.contacts;
	defaultDisplay = target.display.value;
	process(0); 
}

<!DOCTYPE html>
<html>
<head>
<title>Lista de contatos</title>
</head>
<body>
	<form name="contacts" action="javascript:;" >
		<input name="action" type="button" value="Load" data-button="0" onclick="process( this );"><br>
		<textarea name="display" cols="80" rows="20">Bem vindo!</textarea><br>
		<input name="action" type="button" value="Mostrar contatos" data-button="1" onclick="process( this );">
		<input name="action" type="button" value="Adicionar" data-button="2" onclick="process( this );">
		<input name="action" type="button" value="Remover" data-button="3" onclick="process( this );">
		<input name="action" type="button" value="Limpar tela" data-button="4" onclick="process( this );">
		<input name="action" type="button" value="Salvar" data-button="5" onclick="process( this );">
		<input name="action" type="button" value="Mudar Pin" data-button="6" onclick="process( this );">
	</form>
</body>
</html>