CODEWITHSUNDEEP
javascripthtml
Fajar Syairillah
Fajar Syairillah

Reputation: 33

Inserting Value with label using innerHTML

I'm trying to have multiple values inside a label using innerHTML. Here's an example to better explain my issue.

<div class="form-group">
  <label for="" class="mb-0" id="pointReferral"></label>
</div>

<script type="text/javascript">
  referralCode();

  function referralCode() {
    var pointStart = "12";
    var pointEnd = "40";
    document.getElementById("pointReferral").innerHtml = "Number of Friends invited " + pointStart + "/" + pointEnd + " Friends";
  }
</script>

As you can see, I have two variables and I don't know how to use them so they become strings. Thank you.

Upvotes: 0

Views: 992

Answers (3)

Saurabh Pathak
Saurabh Pathak

Reputation: 1

if you want to convert a number into string in innerHTML then your method is right, if you want to do mathematical calculation then remove quotes "" from / like

"Number of Friends invited " + (pointStart/pointEnd) + " Friends"

Upvotes: 0

Biplove Lamichhane
Biplove Lamichhane

Reputation: 4095

It is just a syntax error, should have used innerHTML, used innerHtml. It will do string concatenation, show will have no problem where you had doubt.

referralCode();

function referralCode() {
  var pointStart = "12";
  var pointEnd = "40";
  // innerHTML
  //document.getElementById("pointReferral").innerHTML = "Number of Friends invited " + pointStart + "/" + pointEnd + " Friends";
  
  // ES6 way
  document.getElementById("pointReferral").innerHTML=`Number of Friends invited ${pointStart}/${pointEnd} Friends`;
}
<div class="form-group">
  <label for="" class="mb-0" id="pointReferral"></label>
</div>

You can use ES6 and it new features. Here, I showed you a ES6 method to use variable inside a string. But, you did correctly, except for that innerHtml.

Upvotes: 2

Jesper Martinez
Jesper Martinez

Reputation: 631

It seems you have a Syntax error instead of innerHTML.

document.getElementById("pointReferral").innerHTML= "Number of Friends invited " + pointStart + "/" + pointEnd + " Friends";

Upvotes: 1

Related Questions