When I call display() function from switch statement, the display function doesn't work. Please help.

Question

<script>
var SN = document.getElementById('serialno');
var header = document.getElementById('header');
var trfLocation = document.getElementById('trfLocation');
var trfSupplyTo = document.getElementById('trfSupplyTo');
var trfPower = document.getElementById('trfPower');
var trfVoltage = document.getElementById('trfVoltage');

function transformer(location, supplyTo, power, voltage) {
this.location = location;
this.supplyTo = supplyTo;
this.power = power;
this.voltage = voltage;
}

function validate() {
if (SN.value == '' || SN.value == null) {
alert('Enter a serial no.');
} else {
switch (SN.value) {
// FOR C882
case '180384':
var TRF = new transformer('C882 TRF1', '22kV Surface RMU1', '3000kVA', '22kV/11kV');
display();
break;

case '180383':
var TRF = new transformer('C882 TRF2', '22kV Surface RMU2', '3000kVA', '22kV/11kV');
display();
break;

case '180385':
var TRF = new transformer('C882 TRF3', '2800A LVMSB', '2000kVA', '22kV/415V');
display();
break;

default:
trfLocation.innerHTML = 'Transformer with serial no.' + SN.value + ' does not exit in project.';
}
}
}
function display() {
header.innerHTML = "The transformer with serial no." + SN.value + " details are as follow:";
trfLocation.innerHTML = "Transfomer Location: " + TRF.location;
trfSupplyTo.innerHTML = "Serving To: " + TRF.supplyTo;
trfPower.innerHTML = "Power: " + TRF.power;
}

Answer 1

It's because the variable TRF is a local function to the validate function, meaning it won't exist in the display function. You can get around it, if you declare the variable at the start of the script and then assign a value to it when validating:

var TRF;

// ...

case '180384':
TRF = new transformer( ... );

(Also, constructor functions should begin with an uppercase letter, so "Transformer" instead of "transformer")

Answer 2

Thanks Airree