How to pass the JavaScript value into input field

Question

I did the code for to move the range button the amount will increasing that value coming for span id also i did this through JavaScript but i try get that same value in inside the input field i can't understand what is the issues please help me to fix this issues.

var output = document.getElementById("demo");

document.getElementById("demo").value = output;

output.innerHTML = slider.value;

slider.oninput = function() {
    output3.innerHTML = this.value;
    output.innerHTML = this.value;

 output2.innerHTML = this.value;
}

<div class="col-md-12">
  <p>Loan Amount<span id="demo3"></span></p>
  <input type="range" min="5000" max="50000" value="1000" class="slider" id="myRange" step="1000">
</div>


<div class="col-md-12">
  <p>Loan Period</p>
  <input type="range" min="10" max="50" class="slider" id="myRange2" step="10" oninput="getInput(this.value)">
</div>


<div class="col-md-4">
  <img src="./assets/img/cal-01.png" style=" max-width: 48%; " />
  <p>Loan Amount:<br/><span id="demo"></span></p>
</div>

<div class="col-md-4">
  <img src="./assets/img/cal-02.png" style=" max-width: 37%; " />
  <p>Loan Period:<br/><span id="demo4"></span> Days</p>
</div>


<input type="text" class="form-control" id="demo" name="demo">

I want to pass the span ID value to Input field ID

First of all, you have two elements with the same id demo. Ids are supposed to be unique in a HTML file. In this case, the two document.getElementById("demo") will retrieve the same element. Try changing the id of one of them. — Rodrigo Morbach
– Rodrigo Morbach, Commented Feb 11, 2019 at 17:28
Don’t include unrelated tags. As there is neither jQuery nor XHR shown I have removed those tags. — user2864740
– user2864740, Commented Feb 11, 2019 at 20:45

Chibuzo · Accepted Answer · 2019-02-11 17:43:27Z

1

First of all, no two elements should have the same id in a html document, so you will have to change one of the elements with id "demo" to something unique.

Then use .textContent to get the content on the span element.

var output = document.getElementById("span-demo");  // this is the span element

document.getElementById("demo").value = output.textContent; // put the text context inside the value of the input element.

output.innerHTML = slider.value;

slider.oninput = function() {
    output3.innerHTML = this.value;
    output.innerHTML = this.value;

 output2.innerHTML = this.value;
}

answered Feb 11, 2019 at 17:43

Chibuzo

6,1133 gold badges33 silver badges54 bronze badges

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

Collectives™ on Stack Overflow

How to pass the JavaScript value into input field

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related