Increment number in JavaScript

Question

I have 2 fields prefix and value. Suppose when I put prefix as A and value as 10, it should give me result A1 to A10. In my code it gives me result A1 to A10 but at start it appends value too. That means it gives 10A1 instead of only A1. Thank you. Sorry for grammar.

function saveForm(){
    var val = document.getElementById("val").value;
    var prefix = document.getElementById("prefix").value;
    for(i=1; i<=parseInt(val); i++){
     val += prefix + i + "<br>"; 
    }
    document.getElementById("demo").innerHTML = val;
 }

<label>Prefix</label>
<input id="prefix" name="prefix"  type="text" /><label>Value</label><input id="val" type="text" />
<button type="button"  onClick="saveForm()" />Save</button>

<p id="demo"></p>

Rayon · Accepted Answer · 2017-05-15 09:21:48Z

1

You are using the existing variable val which already has value hence value will be concatenated with previous value.

Use different variable which has be initialized as ''

function saveForm() {
  var val = document.getElementById("val").value;
  var prefix = document.getElementById("prefix").value;
  var value = '';
  for (var i = 1; i <= parseInt(val); i++) { //declare i using keyword "var" or else it will be global
    value += prefix + i + "<br>";
  }
  document.getElementById("demo").innerHTML = value;
}

<label>Prefix</label><input id="prefix" name="prefix" type="text" /><label>Value</label><input id="val" type="text" />
<button type="button" onClick="saveForm()">Save</button>
<p id="demo"></p>

edited May 15, 2017 at 9:21

answered May 15, 2017 at 9:16

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Zaid Bin Khalid · Accepted Answer · 2017-05-15 09:18:37Z

0

Try now. you just need to change the variable names.

function saveForm() {
  resval  = '';
  var myval = document.getElementById("val").value;
  var prefix = document.getElementById("prefix").value;
  for (i = 1; i <= parseInt(myval); i++) {
    resval += prefix + i + "<br>";
  }
  document.getElementById("demo").innerHTML = resval;
}

<body>

  <label>Prefix</label><input id="prefix" name="prefix" type="text" /><label>Value</label><input id="val" type="text" />

  <button type="button" onClick="saveForm()" />Save</button>

  <p id="demo"></p>

</body>

answered May 15, 2017 at 9:18

Zaid Bin Khalid

7639 silver badges27 bronze badges

Comments

Faizal · Accepted Answer · 2017-05-15 09:21:23Z

0

Declare a new variable temp, assign inside for loop then show using innerHTML.

function saveForm(){
   var val = document.getElementById("val").value;
   var prefix = document.getElementById("prefix").value;
   var temp = "";
   for(i=1; i<=parseInt(val); i++){
      temp += prefix + i + "<br>";
   }
   document.getElementById("demo").innerHTML = temp;
}

answered May 15, 2017 at 9:21

Faizal

2501 silver badge8 bronze badges

Collectives™ on Stack Overflow

Increment number in JavaScript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related