Displaying correct data from objects on form input

user_7093346 0
Viewed 103

I am in the process of learning, so I will call myself somewhat of a newbie to JavaScript. I am finally able to get one of the objects to display after entering it into the html form. But when entering a different variable, the same object is displayed. These are lock cylinder designations for door locks and the data associated with each.

I added an if statement to attempt to switch between the objects, but it will only show the data from "RD" even if I enter "LD". So apparently I am doing something wrong in how I am using getElementById, or using the wrong Id? I am happy I got this far with the help of some other threads I read, but I'm a bit stuck now.

Here is my code showing two of the objects:

var display = document.getElementById("displayCyl");

function getCyl(){
  if(document.getElementById("cylEnter").value = "RD"){
    display.innerHTML=display.innerHTML + Object.values(RD);
   }
  else if(document.getElementById("cylEnter").value = "LD"){
    display.innerHTML=display.innerHTML + Object.values(LD);
   }
  }

  var LD = {
  brand: 'Schlage, Falcon',
  cylinder: ' Without cylinder',
  pins: ' 6 Pin',
  type: ' KIL'
 }

  var RD = {
  brand: 'Schlage-Everest 29 S123 (Standard)',
  cylinder: ' With cylinder',
  pins: ' 6 Pin',
  type: ' FSIC'
 }
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title></title>
</head>
<body>
  <h2>Cylinder Selector</h2>
    <h3>For AD and CO Locks</h3>
  <form name="cylForm">
    <input type="text" id="cylEnter" placeholder="Enter">
    <input type="button" onclick="getCyl()" value="Submit Cylinder">
  </form>
<p id="displayCyl"></p>

What I would like to do ultimately is have about 10 objects that can be individually entered into the form. Then it should display the correct data for that cylinder. Just looking for the raw data for now, then styling and formatting later.

dom html javascript
2 Answers

Change '=' with '==' 

if(document.getElementById("cylEnter").value == "RD"){
    display.innerHTML=display.innerHTML + Object.values(RD);
   }
  else if(document.getElementById("cylEnter").value == "LD"){
    display.innerHTML=display.innerHTML + Object.values(LD);
   }

OR

if you want to check the type also than change '==' with '==='

user_85048030

In javascript = in document.getElementById("cylEnter").value = "RD" means set value to 'RD'. If you need to compare then use == or ===

user_59522790
Related