CODEWITHSUNDEEP
javascripthtml
Doğu Saraçoğlu
Doğu Saraçoğlu

Reputation: 41

TextBox Value Issue

I've build a website that read barcode from the camera. I can catch the barcode text and print it to the P element as you can see below. But I want to see it in textbox. Is this possible? I can't see the barcode at value of the textbox.

enter image description here

After press the Scan Barcode button:(5901234123457 is scanned barcode. I want to see it in textbox) enter image description here

  <p id="code">I see the scanned value here</p>

   <input class="form-control" type="text" id="code" value="Scanned barcode must be seen here...">
   <button  onclick="barkod()" type="submit" class="btn btn-primary btn-sm">Scan Barcode</button>

    <script>
    function barkod() {
    var resultElement = document.getElementById("code");
    setupLiveReader(resultElement)
    }  
    </script

Upvotes: 2

Views: 60

Answers (2)

atul-gairola
atul-gairola

Reputation: 149

I guess the issue you are facing is because you have the same id attribute id="code" in both the elements, so the getElementById("code") returns the first element with the id "code" and thus only that value changes.

Just change the id of the <p> tag and add id="code" on the input tag

// whatever the value you want
const barcode = 12345566;

document.getElementById("code").value = barcode;
 <p id = "para"></p>
<input class="form-control" type="text" id="code" value="Scanned barcode must be seen here..." />

Upvotes: 1

UModeL
UModeL

Reputation: 1227

Item IDs must be unique within a single page.

function barkod() {
  document.getElementById("code_copy").value = document.getElementById("code_src").textContent;
  //setupLiveReader(resultElement);
}
<p id="code_src">5901234123457</p>

<input class="form-control" type="text" id="code_copy" value="Scanned barcode must be seen here...">
<button onclick="barkod()" type="submit" class="btn btn-primary btn-sm">Scan Barcode</button>

Upvotes: 1

Related Questions