Formulário para php com caixa de textos exibindo resultados Javascript

[Alanartes 0]

Por favor me ajudem passar as coordenada do JAVASCRIPT  Latitude e Longitude para as respectivas caixas do formulário

 

<h1>Adicionar local de atendimento</h1>

<p id="demo">Clique no botão para receber as coordenadas:</p>
<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition,showError);
    }
  else{x.innerHTML="Seu browser não suporta Geolocalização.";}
  }
  </script>
<script>
function showPosition(position)
  {

  x.innerHTML="Latitude: " + position.coords.latitude +
  "<br>Longitude: " + position.coords.longitude; 
document.getElementById( "caixaTexto" ).value = html;	  
  }
function showError(error)
  {
  switch(error.code)
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="Usuário rejeitou a solicitação de Geolocalização."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="Localização indisponível."
      break;
    case error.TIMEOUT:
      x.innerHTML="A requisição expirou."
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML="Algum erro desconhecido aconteceu."
      break;
    }
  }
</script>
<form id="form1" name="form1" method="post" action="?">
  <label for="UF">UF:</label>
  <input type="text" name="UF" id="UF" />
  <label for="cidade">Cidede:</label>
  <input type="text" name="cidade" id="Cidade" />
  <label for="bairro">Bairro:</label>
  <input type="text" name="bairro" id="bairro" />
  <label for="rua">Rua:</label>
  <input type="text" name="rua" id="rua" />
  <label for="latutude">Latitude:</label>
  <input type="text" name="latitude" id="latitude" />
  <label for="longitude">Logitude</label>
  <input type="text" name="longitude" id="longitude" />
  <input name="add_local" type="hidden" id="add_local" value="1" />
  <input type="submit" name="button" id="button" value="cadastrar" />
</form>
<p>&nbsp;</p>
</body>
</html>