Question: How can I make a code to make this happened: Im writing in HTML and javascript - Checking that either tel or email is filled

How can I make a code to make this happened: Im writing in HTML and javascript

- Checking that either tel or email is filled in
- Checking that email is valid
- Checking that tel contains only numbers and + - ( ) and space

here's my code:

HTML:

Add entry

Name Tel Email

Javascript:

var Rows = null

function Form() {

var formData = readFormData();

if (Rows == null)

insertNewRecord(formData);

else

updateRecord(formData);

resetForm();

}

function readFormData() {

var formData = [];

formData["name"] = document.getElementById("name").value;

formData["tel"] = document.getElementById("tel").value;

formData["email"] = document.getElementById("email").value;

return formData;

}

function insertNewRecord(data) {

var table = document.getElementById("MyList").getElementsByTagName('tbody')[0];

var newRow = table.insertRow(table.length);

cell1 = newRow.insertCell(0);

cell1.innerHTML = data.name;

cell2 = newRow.insertCell(1);

cell2.innerHTML = data.tel;

cell3 = newRow.insertCell(2);

cell3.innerHTML = data.email;

cell4 = newRow.insertCell(3);

cell4.innerHTML = `Edit

Delete`;

}

function insert(){

var table = document.getElementById("MyList").getElementsByTagName('tbody')[0];

var newRow = table.insertRow(table.length);

cell1 = newRow.insertCell(0);

cell1.innerHTML = "Nina";

cell2 = newRow.insertCell(1);

cell2.innerHTML = "48569244";

cell3 = newRow.insertCell(2);

cell3.innerHTML = "example";

cell4 = newRow.insertCell(3);

cell4.innerHTML = `Edit

Delete`;

var newRow = table.insertRow(table.length);

cell1 = newRow.insertCell(0);

cell1.innerHTML = "harald";

cell2 = newRow.insertCell(1);

cell2.innerHTML = "98569144";

cell3 = newRow.insertCell(2);

cell3.innerHTML = "example email";

cell4 = newRow.insertCell(3);

cell4.innerHTML = `Edit

Delete`;

var newRow = table.insertRow(table.length);

cell1 = newRow.insertCell(0);

cell1.innerHTML = "susanne";

cell2 = newRow.insertCell(1);

cell2.innerHTML = "45625894";

cell3 = newRow.insertCell(2);

cell3.innerHTML = "example mail";

cell4 = newRow.insertCell(3);

cell4.innerHTML = `Edit

Delete`;

}

function resetForm() {

document.getElementById("name").value = "";

document.getElementById("tel").value = "";

document.getElementById("email").value = "";

selectedRow = null;

}

function Edit(td) {

selectedRow = td.parentElement.parentElement;

document.getElementById("name").value = selectedRow.cells[0].innerHTML;

document.getElementById("tel").value = selectedRow.cells[1].innerHTML;

document.getElementById("email").value = selectedRow.cells[2].innerHTML;

}

function updateRecord(formData) {

selectedRow.cells[0].innerHTML = formData.name;

selectedRow.cells[1].innerHTML = formData.tel;

selectedRow.cells[2].innerHTML = formData.email;

}

function Delete(td) {

if (confirm('Do you want to delete it?')) {

row = td.parentElement.parentElement;

document.getElementById("MyList").deleteRow(row.rowIndex);

resetForm();

}}

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!