.getJSON won't execute for input

Question

I have 2 sections

• The first section, I want to get location input from the user. This is where .getJSON doesn't execute.
• The second section, I check if geolocation is compatible with the browser, and if permission is given, .getJSON executes. This one works just fine.

I don't think if(navigator.geolocation) checks for if permission was granted, only that geolocation is compatible with the browser.

This line in section 1 $.getJSON(address, function(data) doesn't execute like it does in section 2. If i place `console.log(address) right before it, it shows, but inside the .getJSON scope it doesn't.

Confused as to what is happening since the functions are identical.

$(document).ready(function() {
  //GET STUFF FUNCTION
  function getStuff(address) {
    api = address; //**EDIT** changed to address
    console.log("clicking or entering works yes");
    $.getJSON(api, function(data) {
      console.log("yay it works");
    });
  };
  // SECTION 1
  $("#searchForm").submit(function(e) {
    var searchInput = $("#searchInput").val();
    var address = "api.openweathermap.org/data/2.5/weather?q=" + searchInput + "&appid=?";

    e.preventDefault();
    getStuff(address);

  });

  $("#searchInput").keypress(function(e) {
    if (e.which == 13) {
      $("#searchBtn").click();
    };
  });

  //SECTION 2
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      lat = position.coords.latitude;
      lon = position.coords.longitude;

      var address = 'http://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&appid=?';

      //tried to use this function for search
      getStuff(address);
    });

I tried minifying this the best I could, I'm unsure of how to do AJAX requests on a fiddle. edit:update https://jsfiddle.net/mq10ps5c/10/

Thank you all, and any critiques are much appreciated

Answer 1

Inside Section 1 and 2 you set the address and then call GetStuff inside this GetStuff function you're not referring to address, instead you reference api

Change your GetStuff function to the below:

function getStuff(address) {
 api = address == null ? "/echo/JSON/" : address;
 console.log("clicking or entering works yes");
 $.getJSON(api, function(data) {
  console.log("yay it works");
 });
};

first check to see if address is null if so set api to "/echo/JSON/" otherwise set api to address value.