+ Start a Discussion
cloud_dougcloud_doug 

document.getElementById('{!$Component.for.block1.longitude}').value

Hi Folks, I have a question regarding an example from the CookBook: "Retrieving a User's Location from a GPS-enabled Phone"

The issue is that I cannot get the latitude/longitude values to display on the form using an iPhone.

I'll use "longitude" as the example.  The functions look like this:

            function updateLocation(lat,lon) {
                document.getElementById('{!$Component.for.block1.longitude}').value="1.01"; /* lon; */
                document.getElementById('{!$Component.for.block1.latitude}').value="2.02";  /* lat; */
            }
            function getLocation() {
                mobileforce.device.getLocation(updateLocation);
                //work around required for Blackberry
                if (window.blackberry)
                    setInterval("getLocation()", 10000);
                    return false;
            }

 

And the apex:form like this:

    <apex:pageblock id="block1">
    Sales Visit Name: <br />
    <apex:inputField value="{!visit.name}" /><br />
    Sales Visit Description: <br />
    <apex:inputField value="{!visit.Description__c}" /><br />
    Longitude: <br />
    <apex:inputField  id="longitude" value="{!visit.Longitude__c}" /><br />
    Latitude: <br />
    <apex:inputField value="{!visit.Latitude__c}" /><br />
    <button type="button" value="GPS" onclick="getLocation();"> Get location </button>

 

On the Apex:inputfield tag for "longitude", I tried adding an "id" value but that did not appear to make a difference.

The original tutorial does not incldue this param.

What am I missing here?   I searched the forums but did not find any reference. I am sure that it is my lack of understanding JS.   thanks for any help.  -doug



 

Best Answer chosen by Admin (Salesforce Developers) 
cloud_dougcloud_doug

I did eventually get this to work fine.  I found the same Cookbook tutorial in one of the Library books - the Apex code looked the same but after fixing a missing ending tag , it worked well by displaying the Lat/Lon in the form.  thanks for your help! -doug

All Answers

Ankit AroraAnkit Arora

Not sure, but can you tell me what happen if you remove "for" from this line :

 

document.getElementById('{!$Component.for.block1.longitude}').value="1.01"; /* lon; */

 And use this line :

 

document.getElementById('{!$Component.block1.longitude}').value="1.01"; /* lon; */

 

Thanks

Ankit Arora

Blog | Facebook | Blog Page

cloud_dougcloud_doug

hi Ankit, I removed the "for."  -- same behavior, the display field is not updated.

shra1_devshra1_dev

No need of giving the block1 as well..

 

try with this:

 

document.getElementById('{!$Component.longitude}').value = '1.01';

cloud_dougcloud_doug

apologies for the long delay, work got in the way.. :-)

 

so the JS function now has this line to hardcode the value:

                document.getElementById('{!$Component.Longitude}').value = '1.01';

 

and the APEX:FORM has the input field defined as:

    Longitude: <br />
    <apex:inputField id="Longitude" value="{!visit.Longitude__c}" /><br />

 

I did read somewhere that the JS function getElementByID was "legacy", yet it did not indicate what the replacement style would be...

 

the issue still remains in that the form, appearing on an iPhone, does not display the set value of 1.01.

I will dig into JS and try to find an alternative method of referencing the field element.

any other ideas are most welcome...

cloud_dougcloud_doug

I did eventually get this to work fine.  I found the same Cookbook tutorial in one of the Library books - the Apex code looked the same but after fixing a missing ending tag , it worked well by displaying the Lat/Lon in the form.  thanks for your help! -doug

This was selected as the best answer