How to loop properly

Question

So here is the overall of what I need to do

1. Start with confirming if the user wants to add a course, if they click ok it gives them a prompt to enter course if they hit cancel it finishes the program.

2. When the user gives an answer to the course, they then need to give their grade for that specific course.

3. Once those two questions are done it needs to go back to ask them if they want to add a course again

this is what i have so far

while (true) {
  var entering = confirm('Do you want to enter a Course?');
  if (entering = true) {
    break;
  }

}
var codeInput = '';
var gradeInput = '';
while (true) {
  codeInput = prompt('Enter Course Code');
  if (codeInput.length === 7) {
    break;
  }
  alert('invalid code');
}

gradeInput = prompt('Enter Grade for ' + codeInput + '');


document.writeln('<table border="1">');
document.writeln('<tr>');
document.writeln('<th>Course Code</th>');
document.writeln('<th>Grade</th>');
document.writeln('<tr>');
document.writeln('<th>' +
  codeInput +
  '</th>');
document.writeln('<th>' +
  gradeInput +
  '</th>');
document.writeln('</tr>');

So I'm not sure how to loop it back to the start and how to make the program stop when you hit cancel when it asks if you want to add another course. I also do not know how to make it so if the user asks to enter another course/grade how to make them into a separate answer to add below in the table.

I hope this makes sense and if anyone can help would be lovely thank you!

ps. This has to all be done using javascript no HTML.

Answer 1

Working fiddle.

Wrap your code in a function so you could call it every time you enter the grad to ask it again.

I suggest to create the table and the header then append the rows when the user answers the prompts :

var number_of_rows = 0;
var table = document.createElement('table');
table.border = '1';

ask();

function ask() {
  var codeInput = '';
  var gradeInput = '';

  var entering = confirm('Do you want to enter a Course?');

  if (!entering) {
    return;
  } else {
    while (true) {
      codeInput = prompt('Enter Course Code');

      if (codeInput.length === 7) {
        break;
      }

      alert('invalid code');
    }
  }

  gradeInput = prompt('Enter Grade for ' + codeInput + '');

  if (number_of_rows === 0) {
    var row = document.createElement('tr');
    var th_1 = document.createElement('th');
    var th_2 = document.createElement('th');
    var txt_1 = document.createTextNode("Course Code");
    var txt_2 = document.createTextNode("Grade");
    th_1.appendChild(txt_1);
    th_2.appendChild(txt_2);
    row.appendChild(th_1);
    row.appendChild(th_2);
    table.appendChild(row);

    number_of_rows++;
  }


  console.log(number_of_rows);

  table = insertRow(codeInput, gradeInput);

  document.body.appendChild(table);
  number_of_rows++;

  ask();
}

function insertRow(codeInput, gradeInput) {
  var row = document.createElement('tr');
  var td_1 = document.createElement('td');
  var td_2 = document.createElement('td');
  var txt_1 = document.createTextNode(codeInput);
  var txt_2 = document.createTextNode(gradeInput);

  td_1.appendChild(txt_1);
  td_2.appendChild(txt_2);
  row.appendChild(td_1);
  row.appendChild(td_2);

  table.appendChild(row);

  return table;
}

Answer 2

According to here https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt

If the user clicks the Cancel button, this function returns null

So all you need is to check if value is null to know if the user clicked cancel

if (codeInput == null) break