little manipulation to a ( javascript + html ) code

Question

hi everybody I hope you are well,

here is my code:

var x = document.getElementById('geo_output');
//x.innerHTML = "here is geo_output";    
function getLocation()
{
  if(navigator.geolocation)
    {
      //x.innerHTML = "Supporting";
      navigator.geolocation.getCurrentPosition(showPosition);
    }
  else
    {
      x.innerHTML = "Browser not Supporting";
    }
}

function showPosition(position)
{
  x.innerHTML = "latitude = "+position.coords.latitude;
  x.innerHTML += "<br />"
  x.innerHTML += "longitude = "+position.coords.longitude;
} 

$('#geo_output').click(getLocation)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <h1>trace your location</h1> 
 <button onClick="getLocation()">Get Location</button> 
  <div id="geo_output">
  </div>
  <br> <br> <br> <br> <br> 
  <div id="form_output">
    <form action="includes/signup.php" method="POST">
    <input type="text" name="lat" placeholder="latitude">
    <br>
    <input type="text" name="lon" placeholder="longitude">
    <br>
    <input type="text" name="id" placeholder="id">
    <br>
    <input type="text" name="name" placeholder="first_name">
    <br>
    <input type="text" name="address" placeholder="address">
    <br>
    <input type="text" name="description" placeholder="description">
    <br>
    <button type="submit" name="submit"> envoyer </button>
  </div>

when i execute it , it gives me a correct result.

but i want to know how to do that, when i click on the button gate location, the latitude and longitude will be inserted directly and automatically into their <input>

<input type="text" name="lat" placeholder="latitude">
<br>
<input type="text" name="lon" placeholder="longitude">

thank you friends

Give them an `id` in the html, find them with `getElementById` and set their `value` property. — Federico klez Culloca, Mar 07 '18 at 11:07

score 1 · Accepted Answer · answered Mar 07 '18 at 11:10

1

To select the right input, give it an ID:

<input id="latitude" type="text" name="lat" placeholder="latitude">
<br>
<input id="longitude" type="text" name="lon" placeholder="longitude">

And in showPosition function:

document.getElementById('latitude').value = position.coords.latitude;
document.getElementById('longitude').value = position.coords.longitude;

answered Mar 07 '18 at 11:10

Ricardo Pontual

3,749
3
28
43

how we can make it in android ?? have you any information about that sir ?? – stackoverstudent Aug 09 '18 at 13:32
do you use any tool/framework, like *ionic* or *cordova/phonegap*? – Ricardo Pontual Aug 09 '18 at 14:43
no sir , it's just android java , in android studio – stackoverstudent Aug 09 '18 at 15:23
In Android there is the *LocationListener* class which you can you use to get location information. This a related question: https://stackoverflow.com/q/1513485/4730201 – Ricardo Pontual Aug 09 '18 at 16:59
thank you sir ,..sorry sir i wanna ask you again because i'm really curious a lot exactly about the action that when i click on the button , the result will be inserted directly and automatically into their how i can do it in the android?? – stackoverstudent Aug 09 '18 at 21:47

score 1 · Answer 2 · answered Mar 07 '18 at 11:11

1

Change the element to have an ID like this

<input type="text" id="lat" id="lat" placeholder="latitude">

Then in JS code do the following

 document.getElementById('lat').value = position.coords.latitude;

And the same for the longitude

answered Mar 07 '18 at 11:11

Jacques Ramsden

801
5
20

sir i wanna ask you again because i'm really curious a lot exactly about the action that when i click on the button , the result will be inserted directly and automatically into their how i can do it in the android??? any ideas or articles who will help me ???? – stackoverstudent Aug 13 '18 at 11:44
Hi @stackoverstudent, I'm not sure how this will be done in Android. I assume it would have the same effect. I would suggest asking another question and others should answer. Sorry I can't answer this for you. – Jacques Ramsden Aug 13 '18 at 15:25

little manipulation to a ( javascript + html ) code

2 Answers2