www.webdeveloper.com
Results 1 to 3 of 3

Thread: Importing values displayed by javascript to input text box

  1. #1
    Join Date
    Feb 2013
    Posts
    1

    Importing values displayed by javascript to input text box

    Hello there, nice to be a part of this community, hope to have some help whit my problem, im making a website that shows job ads, and in the job ad i use a google map script, the dragabble markeble, the one im using is the link above:

    http://gmaps-samples-v3.googlecode.c...e-markers.html

    Whit the marker i can choose the place that i want, but i liked to use the values given by the latitude and longitude (current location in the right side of the page in input text box where would be hidden and when i submitted the form would send the values to by database table.

    Basically what i need is display the values given by javascript code in input text boxes, unfortanlly im a noob whit javascript and hope you guys could help me.

    Best regards

  2. #2
    Join Date
    Mar 2009
    Location
    Wherever i lay my hat
    Posts
    180
    Well, on that sample page, they are in a div with id="info", so you can retrieve them with

    var values = document.getElementById( "info" ).childNodes[ 0 ].nodeValue.split( ", " );

    which splits the string in that div on comma with space and therefore nicely fills values[ 0 ] with the first value and values[ 1 ] with the second. Then you can fill some inputs with them. I'm sure there is a better way using google maps API, but i'm not familiar with it.

  3. #3
    Join Date
    Oct 2010
    Location
    Versailles, France
    Posts
    1,265
    Change simply your javascript and HTML with something like this :

    Code:
    
    // javascript 
    function updateMarkerPosition(latLng) {
      document.getElementById('info').value = [
        latLng.lat(),
        latLng.lng()
      ].join(', ');
    }
    
    function updateMarkerAddress(str) {
      document.getElementById('address').value = str;
    }
    
    
    // HTML
    <form id="infoPanel" method="POST" action="...">
        <b>Marker status:</b>
        <div id="markerStatus"><i>Click and drag the marker.</i></div>
        <b>Current position:</b>
        <input type="hidden" id="info" name="info">
        <b>Closest matching address:</b>
        <input type="text" id="address" name="address">
      </form>
    Add a button to submit the form ...

    NB : To test the page it's convenient to write hidden with a single letter d (the hidden field is then visible).
    Last edited by 007Julien; 02-19-2013 at 04:36 AM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles