access javascript variable in asp.net codebehind

1
votes

I need to store the geolocation(lat,long) when on page_load to a db table.

For which I use this script.

<body onload="getLocation()">

    <p>Click the button to get your coordinates.</p>

            <%--<button onclick="getLocation()">Try It</button>--%>

            <p id="demo"></p>


    <form id="form1" runat="server">
        <div>

            <p>
                <asp:HiddenField ID="hdnLocation" ClientIDMode="Static" runat="server" />
 <asp:Label ID="lblloc" runat="server"></asp:Label>
                <asp:TextBox ID="txtloc" runat="server"></asp:TextBox>
                <asp:Button ID="btnLoc" text="submit" runat="server" OnClick="btnLoc_Click" />

            </p>
        </div>
    </form>

        <script>
            var x = document.getElementById("demo");

            function getLocation() {
                if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(showPosition);
                } else {
                    x.innerHTML = "Geolocation is not supported by this browser.";
                }
            }

            function showPosition(position) {
                x.innerHTML = "Latitude: " + position.coords.latitude +
                "<br>Longitude: " + position.coords.longitude;
                $("[id*=hdnLocation]").val(position.coords.latitude + ' ' + position.coords.longitude);
            //    $("[id*=btnLoc]").trigger("click");
            }
            </script>

</body>
</html>

here is my code behind public partial class getLocation : System.Web.UI.Page

{ protected void Page_Load(object sender, EventArgs e) {

    lblloc.Visible = true;

    lblloc.Text = hdnLocation.Value;
    txtloc.Text = hdnLocation.Value;

}

when I run the page I get values in hidden field when I inspect in browser.

enter image description here

But can't access the hidden field values in code behind. Response.Write comes blank and lblloc.text comes null.

What could be the problem.

2
javascriptc#asp.netgeolocationpageload

2 Answers

0
votes

In order for your current jQuery selector to work, your HTML element needs to have the ClientIDMode property set to "Static".

With server elements in .NET, the server id and the client id are two very different things. This ensures they are the same for this element.

<asp:HiddenField ID="hdnLocation" runat="server" ClientIDMode="Static" />
0
votes

This should work:

HTML

<script type="text/javascript">
function abc()
{
  var str="value";
  document.getElementById("Hidden1").value=str;
}


</script>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="Hidden1" type="hidden" runat="server" />
        <asp:Button ID="Button1" runat="server" OnClientClick="abc()"  Text="Button"
            onclick="Button1_Click" />
    </div>
    </form>
</body>

Code behind

Response.Write(Hidden1.Value);