-1

I want a user to be able to get the closest user. So, I have to get the user's longitude and latitude from the browser and send it to the OnPost action method below. Each time the user visits the website, the position is updated. NOTE: The point class which takes the coordinates in the controller, is from the NetTopologySuite library used for modelling and manipulating 2-dimensional linear geometry

[HttpPost]
public async Task<IActionResult> Profile(ProfileViewModel profileModel, double latitude, double longitude)
{
    var user = await _userManager.GetUserAsync(User);
    if (ModelState.IsValid)
    {
        if (user.DOB != profileModel.DOB) user.DOB = profileModel.DOB;
        user.Location = new Point(latitude, longitude) { SRID = 4326 };
    }
}

Here in the view, I am trying to set the coordinates to the asp-routes defined in the form from the script so I can use it in the controller, but the latitude and longitude are not being sent to the action method above. I am new to jQuery

<form asp-controller="Account" asp-action="Profile" method="post" asp-route-latitude="" asp-route-longitude="">
    <label asp-for="DOB"></label>
    <input asp-for="DOB" class="form-control" />
</form>
<script type="text/javascript">
    var x = document.getElementById("Location");
    window.onload = function () {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition);
        }
        else {
            console.log("Geolocation not supported by browser.");
       }
    }
    function showPosition(position) {
        $("form").attr("asp-route-latitude", position.coords.latitude);
        $("form").attr("asp-route-longitude", position.coords.longitude);
    }
</script>

PS - Even if I fix this problem, I am not sure if this is the best way to achieve the goal where a consumer requests for a vendor and one of the closest ones is sent to him just like Uber. Suggestions on how best to achieve this would be much appreciated.

Qudus
  • 1,440
  • 2
  • 13
  • 22

1 Answers1

1

You need to make an ajax call to controller/action method to sent the data

<script type="text/javascript">
    var x = document.getElementById("Location");
    window.onload = function () {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition);
        }
        else {
            console.log("Geolocation not supported by browser.");
       }
    }
    function showPosition(position) {
        $("form").attr("asp-route-latitude", position.coords.latitude);
        $("form").attr("asp-route-longitude", position.coords.longitude);

       $.ajax({
             url : '[controller_name]/Profile?latitude='+position.coords.latitude+'&longitude='+position.coords.longitude,
             type : 'POST',
             data : {
                 'profileModel' : {}
             },
             dataType:'json',
             success : function(data) {              
                 console.log(data);
             },
             error : function(request,error){
                 console.log(error);
             }
         });
    }
</script>
Vivek Bani
  • 3,703
  • 1
  • 9
  • 18
  • Hi, is it hitting the action method? Else can you provide the error details – Vivek Bani Aug 07 '20 at 23:54
  • No, it's not hitting the action method but I confirmed the url has the query string values for longitude and latitude when the page is loaded. When I check the browser console, I get `parseerror` – Qudus Aug 07 '20 at 23:58
  • Can you check the network tab in developer console if the url is correct? If it's pointing to correct host name and controller name? – Vivek Bani Aug 08 '20 at 00:16
  • This is the error I get now `Failed to load resource: the server responded with a status of 400 () https://localhost:44332/Account/Profile?latitude=6.4249594&longitude=4.9192771` – Qudus Aug 08 '20 at 00:55
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/219440/discussion-between-rajdeep-debnath-and-qudus-giwa). – Vivek Bani Aug 08 '20 at 00:55