Getting Empty Values Using Javascript

Question

I'm trying to get values (latitude, longitude) using Geolocation. I tried using the same Javascript (i'll be posting it under the question) in another page, but this Javascript fires only when a button is clicked,

Focus on the OnClientClick="call(); return false;"

<asp:Button ID="BTN_Register" runat="server" Text="Register" OnClientClick="call();return false;" CssClass="btn btn-theme-bg btn-3d btn-xs" OnClick="BTN_Register_Click" />

So returning to my problem.. I am using the same Javascript codes as i was in another WebForm. And the process of it is retrieving the Latitude and Longitude then parsing it into 2 asp:HiddenFields and then saving them into the database using the Code Behind (aspx.cs),

resultRecord = al.createLogEntry(username, externalIP, Convert.ToDouble(latitudeTB.Value), Convert.ToDouble(longitudeTB.Value), "Pending");

Write now in a different WebForm on the HTML side,

These are my codes,

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" Runat="Server">
<p class="text-success" runat="server" id="loginDetails"></p>
<p class="text-danger" runat="server" id="logoutDetails"></p>

<div>
    <asp:HiddenField runat="server" ID="latitudeTB"/>
    <asp:HiddenField runat="server" ID="longitudeTB"/>

    <script type="text/javascript">
    //GeoLocation Retrieval
    var geo = document.getElementById("geolocationValue");
    function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function (position) {
                var lat = position.coords.latitude;
                var lng = position.coords.longitude;
                document.getElementById("<%=latitudeTB.ClientID %>").value = lat;
                document.getElementById("<%=longitudeTB.ClientID %>").value = lng;
            });

        } else {
            geo.innerHTML = "Geolocation is not supported by this browser.";
        }
    }
    function call() {
        getLocation();
    }

    /*document.onreadystatechange = function (e) {
        if (document.readyState === 'complete') {
            //dom is ready, window.onload fires later
            call();
        }
    };*/

    /*$(window).load(function () {
        call();
    });*/
</script>

</div>

And in Page_Load i used this RegisterClientScriptBlock to actually cause the HiddenFields to be filled with the Latitude and Longitude respectively to then be saved into the database with the same method from the other WebForm i posted above,

ScriptManager.RegisterClientScriptBlock(this, GetType(), "StartGeo", "call();", true);

    Debug.WriteLine(latitudeTB.Value);
    Debug.WriteLine(longitudeTB.Value);

I want my Longitude and Latitude values to be present the moment the page loads, But seems to no avail.. I checked the values of the HiddenFields but i'm getting nothing at all.. It means that the HiddenFields are either empty or null?

May i know what can i do to solve this?

Appreciate any help please.. Thank you!

There are a couple of possible issues. 1) your code isn't calling getLocation(). 2) it's not actually writing the values to the hidden fields, or 3) they aren't being saved when you check in Page_Load. Just to double check... do you know for sure your getLocation() method is being called? and that it's actually writing the values? — Eric Burdo
– Eric Burdo, Commented Aug 1, 2017 at 12:00
i have not much javascript experience or i have never learnt it before.. i can't really tell unfortunately.. how can i test? i actually just used Debug.WriteLine to check if the HiddenFields have values inside.. — domster
– domster, Commented Aug 1, 2017 at 12:07
@EricBurdo i tried the link you provided but it still doesn't get any values.. — domster
– domster, Commented Aug 1, 2017 at 12:15

Sanil · Accepted Answer · 2017-08-01 11:24:49Z

1

You have put wrong variables. Change "latitude" & "longitude" to lat & lng. Check edited code below.

var lat = position.coords.latitude;
var lng = position.coords.longitude;
document.getElementById("<%=latitudeTB.ClientID %>").value = lat;
document.getElementById("<%=longitudeTB.ClientID %>").value = lng;

your previous code were.

var lat = position.coords.latitude;
var lng = position.coords.longitude;
document.getElementById("<%=latitudeTB.ClientID %>").value = latitude;
document.getElementById("<%=longitudeTB.ClientID %>").value = longitude;

edited Aug 1, 2017 at 11:24

answered Aug 1, 2017 at 11:19

Sanil

1269 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

domster Over a year ago

Thanks Sanil, didnt realise.. But to no avail I'm still getting empty values in my Debug for the 2 HiddenFields..

Sanil Over a year ago

Hi @domster can put an alert(lat+","+lng) below the code snippet var lat = position.coords.latitude; var lng = position.coords.longitude; Just to check whether it's calling navigator.geolocation.getCurrentPosition() function

Sanil Over a year ago

@domster navigator.geolocation.getCurrentPosition will only work via https. But it will work for localhost. If you are using Chrome browser and not working, try to run your code in Firefox browser. It will definitely work. But remember geolocation is HTML5 based API, so update your browsers to the latest one.

Collectives™ on Stack Overflow

Getting Empty Values Using Javascript

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related