How to show map mouse hover values on text box using openlayers3?

Question

I am working on ol3, and I have the following mouse hover code, which gets latitudes and longitudes, then throws them on the "DIV" whose id is 'mouse-position':

var mousePositionControl = new ol.control.MousePosition({
  coordinateFormat: ol.coordinate.createStringXY(4),
  projection: 'EPSG:4326',
  // comment the following two lines to have the mouse position
  // be placed within the map.
  className: 'custom-mouse-position',
  target: document.getElementById('mouse-position'),
  undefinedHTML: ' '
});

and the corresponding html div is:

<div class="span6" id="mouse-position">&nbsp;</div>

PROBLEM: I want to show these latitude/longitude values to be shown on the "TEXTBOX" , rather than to simply show them on a div.

I simple changed the div id to textbox's id in "target" field, but it didn't work! I also played around with value attribute but couldn't find the solution. I am looking forward for the suggestions, thank you very much for the time. :)

NOTE: The complete code of these above snippets can be found at this link: http://openlayers.org/en/master/examples/mouse-position.html

Answer 1

If by "textbox" you mean textarea then this won't work. Textarea requires a value rather than a "innerHTML like".

Answer 2

try this to get coordinates:

var corde = document.getElementsByClassName("custom-mouse-position");
var resultElement=corde[0].innerHTML

then set this value to your textbox