I am currently developing a register & login system with HTML, CSS, JavaScript and PHP.

Expiration
The user inputs his email and password in the with CSS styled input fields of html. Now if the user press the login button, JavaScript gets the user email and password of these input fields and calls the login.php script with the parameters email and password. The PHP script does the main work than and returns the access or denial to JavaScript. At last JavaScript shows the user error or give access based on the PHP script answer.

Detailsnippet of Javascript

function loginuser(email, password) {
  if (email || password) {
    query('./php/login.php', null, [['email', email], ['password', password]]).then(function(obj) {
      console.log("REPLY");
      if (obj.error) {
        //ERROR
      }
      else {
        //ACCESS
      }
    });
  }
  else {
    //PASSWORD , EMAIL CAN NOT BE EMPTY
  }
}

function query(url, cmd_type, data_array) {
  var request = new XMLHttpRequest();
  var params= '';
  params = params + 'cmdtype=' + encodeURIComponent(cmd_type) + '&';
  if (data_array) {
    data_array.forEach(function(item) {
      if (Array.isArray(item[1])) {
        var serialized_tda = '';
        item[1].forEach(function(tdai) {
          serialized_tda = serialized_tda + "|" + tdai[0] + "," + tdai[1] + "|";
        });
        params = params + item[0] + '=' + encodeURIComponent(serialized_tda) + '&';
      }
      else {
        params = params + item[0] + '=' + encodeURIComponent(item[1]) + '&';
      }
    });
  }

  return new Promise(function(resolve, reject) {
    request.open('POST', url, true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    request.onreadystatechange = function() {
      if (request.readyState === XMLHttpRequest.DONE) {
        if (request.status === 200) {
          var response = JSON.parse(request.response);
          resolve(response);
        }
        else {
          resolve({error: 'Cant connect!'});
        }
      }
    };
    request.send(params);
  });
}

Doubts - The problem
Since I am calling a script with parameters it can be found in the network tab in browser dev console with all parameters I sent.

Does this disappear when I use a SSL certificate in production later, do I have to encrypt data in JavaScript before I can send it via parameters to php or is this normal?