How to get display this javascript returned value in html input field?

Question

I want the result of JavaScript in my input field so that it will push the value to my server while clicking submit.

In this code I am able to get the Javascript result in HTML but I don't know how to display it in the input field.

My code is below. It will return the local LAN IP.

I am creating this page to fetch the local IPs from our office pc. Now the IP is displayed in the web page but I want it to be displayed in input box so that when user clicks on submit, the result is pushed to the server / database.

This when used in HTML body will display in web page. This class='ipAdd' should be displayed in input field by setting its value.

$(document).ready(function ubsrt() {
  window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
  var pc = new RTCPeerConnection({
      iceServers: []
    }),
    noop = function() {};

  pc.createDataChannel("");
  pc.createOffer(pc.setLocalDescription.bind(pc), noop);
  pc.onicecandidate = function(ice) {
    if (!ice || !ice.candidate || !ice.candidate.candidate) return;

    var myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];

    console.log('my IP: ', myIP);
    $('.ipAdd').text(myIP);

    pc.onicecandidate = noop;

  };
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="formGroup">
  <label for="address">IP Address</label> <br>
  <input type="text" class="one" id="address" name="address" size="50px" id="" Value="id=" list "">
</div>

<h3 class='ipAdd'>
  <h3>

Does this answer your question? Jquery Setting Value of Input Field — C3roe
– C3roe, Commented Feb 20, 2020 at 8:55

ADyson · Accepted Answer · 2020-02-20 10:43:26Z

1

If you want to display write something to a textbox, you can use jQuery's .val() function to set the value of the textbox. In your case, you can use the ID of the textbox to identify it. Therefore

$('#address').val(myIP);

will work.

Run this demo to see it:

$(document).ready(function ubsrt() {
  window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
  var pc = new RTCPeerConnection({
      iceServers: []
    }),
    noop = function() {};

  pc.createDataChannel("");
  pc.createOffer(pc.setLocalDescription.bind(pc), noop);
  pc.onicecandidate = function(ice) {
    if (!ice || !ice.candidate || !ice.candidate.candidate) return;

    var myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];

    console.log('my IP: ', myIP);
    $('#address').val(myIP);
    $('.ipAdd').text(myIP);

    pc.onicecandidate = noop;

  };
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="formGroup">
  <label for="address">IP Address</label> <br>
  <input type="text" class="one" id="address" name="address" size="50px" id="" Value="id=" list "">
</div>

<h3 class='ipAdd'></h3>

(N.B. Friendly hint: The above is some of the most basic jQuery syntax. If you're unsure about this kind of thing then it might be time to improve your jQuery skills by studying some tutorials etc.

edited Feb 20, 2020 at 10:43

answered Feb 20, 2020 at 9:10

ADyson

62.9k16 gold badges88 silver badges100 bronze badges

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

3 Comments

Amit Over a year ago

I wanted it to display in this input field. ie in value field so that it will get posted while submitting. <input type="text" class="one" id="address" name="address" size="50px" id ="" Value = "" >

ADyson Over a year ago

Yes I know, you explained that already in your question. That's exactly what the code above will do - it selects the "address" input by ID using an ID selector (#address) and then sets the value of that input (using .val()). If there's a problem when you tried to use it, please be more specific about exactly how you used it, and what went wrong.

ADyson Over a year ago

Look at my updated answer now - I made a runnable demo to prove that it works.

Dhaval Gol · Accepted Answer · 2020-02-20 08:53:49Z

0

Try below code for help.

$('.ipAdd').html(myIP);  // this value display in html
$('#address').val(myIP); // this value store in input

answered Feb 20, 2020 at 8:53

Dhaval Gol

1601 silver badge11 bronze badges

Collectives™ on Stack Overflow

How to get display this javascript returned value in html input field?

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related