CODEWITHSUNDEEP
javascripthtmldom
ipodlover3354
ipodlover3354

Reputation: 469

Another HTML-Javascript Mishap

function updateScript() {
  var wilson = document.getElementById("wilson");
  var willow = document.getElementById("willow");
  var mighty = document.getElementById("mighty");
}
window.addEventListener("click", function(event) {

  updateScript();
  console.log(wilson + willow + mighty);
});
<input style="text" name="wilson" id="wilson" maxlength="1" size="1">
<input style="text" name="willow" id="willow" maxlength="1" size="1">
<input style="text" name="mighty" id="mighty" maxlength="1" size="1">

The console.log doesn't add my values, but here is the object:

It outputs [object HTMLInputElement][object HTMLInputElement][object HTMLInputElement]

How can this be fixed to add the values? (the input has javascript to prevent letters, only allows numbers)

Upvotes: 0

Views: 56

Answers (3)

olive_tree
olive_tree

Reputation: 1457

You need to use .value, this is the correct code for your updateScript():

updateScript();
   console.log(wilson.value +willow.value + mighty.value);
});

You can learn more about the property: http://www.w3schools.com/jsref/prop_option_value.asp

UPDATE: After looking at code, you have a problem with your HTML validation, you had <head> tags inside <body>, that is a problem and will make your whole code not function right. You can use HTML validators to check if your code is validating, it needs to be valid before it can even work!

You can put your <script> inside the <head> tag or in <body> tag.

Upvotes: 1

Nick
Nick

Reputation: 14283

You have to extract the values of all the inputs.

here's a working fiddle: http://jsfiddle.net/bm3eLwL9/

Upvotes: -1

user3524542
user3524542

Reputation:

document.getElementById returns an object. You need to extract the value.

console.log(wilson.value + willow.value + mighty.value);

Upvotes: 0

Related Questions