I have working javascript, but when I change server and link it didnt work

Question

<script type="text/javascript">
        function passCheck(){
              var pass1 = document.getElementById('password').value;
              var pass2 = document.getElementById('confirmPassword').value;
              if(pass1 == pass2 && pass1 != ""){
                  return true;
              }
              else{
                  alert("Both password inputs do not match. Please retry.");
                  document.getElementById('surveyorForm').reset();
                  return false;
              }
          }

          function change() {

            var x = document.getElementById("select").value;


          (function () {

            var xmlhttp = new XMLHttpRequest();
            var url = "http://somejsondata?someget=" + x ;

            xmlhttp.onreadystatechange=function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    myFunction(xmlhttp.responseText);
                }
            }
            xmlhttp.open("GET", url, true);
            xmlhttp.send();

            function myFunction(response) {
                var arr = JSON.parse(response);
                var i;
                var out = "<div class='form-group'>" + 
                            "<label>City</label>" +
                             "<select class='form-control' name='cityId'>" +
                             "<option disabled selected>Select your option</option>";

                for(i = 0; i < arr.length; i++) {
                    out += "<option value='" +
                    arr[i].cityId +
                    "'>" +
                    arr[i].cityName +
                    "</option>";
                }
                out += "</select>" +
                     "</div>";
                document.getElementById("city").innerHTML = out;
            }
          })();

        }

        (function () {
            var xmlhttp = new XMLHttpRequest();
            var url = "http://somejsondata";

            xmlhttp.onreadystatechange=function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    myFunction(xmlhttp.responseText);
                }
            }
            xmlhttp.open("GET", url, true);
            xmlhttp.send();

            function myFunction(response) {
                var arr = JSON.parse(response);
                var i;
                var out =  "<div class='form-group'>" +
                            "<label>Province</label>" +
                             "<select class='form-control' id='select' name='provId' onchange='change()'>" +
                             "<option disabled selected>Select your option</option>";

                for(i = 0; i < arr.length; i++) {
                    out += "<option value='" +
                    arr[i].provinceId +
                    "'>" +
                    arr[i].provinceName +
                    "</option>";
                }
                out += "</select>" +
                     "</div>";
                document.getElementById("province").innerHTML = out;
            }


          })();

          (function () {
            var xmlhttp = new XMLHttpRequest();
            var url = "http://somejsondata";

            xmlhttp.onreadystatechange=function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    myFunction(xmlhttp.responseText);
                }
            }
            xmlhttp.open("GET", url, true);
            xmlhttp.send();

            function myFunction(response) {
                var arr = JSON.parse(response);
                var i;
                var out = "<div class='form-group'>" + 
                            "<label>Country</label>" +
                             "<select class='form-control' name='countryId'>" +
                             "<option disabled selected>Select your option</option>";

                for(i = 0; i < arr.length; i++) {
                    out += "<option value='" +
                    arr[i].countryId +
                    "'>" +
                    arr[i].countryName +
                    "</option>";
                }
                out += "</select>" +
                     "</div>";
                document.getElementById("country").innerHTML = out;
            }
          })();

        </script>

I already put this script right before </body> and check the link it work resulting json data. But why when I access site it didn't show up like I before migrating website. The dropdown menu just didn't show up.

I add some errors what kind error is this

XMLHttpRequest cannot load http://gpx1.gdn/country/read. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://gpx2.gdn' is therefore not allowed access.
insertSurveyor:1 XMLHttpRequest cannot load http://gpx1.gdn/province/read. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://gpx2.gdn' is therefore not allowed access.
firebug-lite.js:11883 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.fetchResource @ firebug-lite.js:11883
firebug-lite.js:30905 Uncaught TypeError: Cannot read property 'push' of undefined(…)

Answer 1

If I am right you are doing an XMLHttpRequest to a different domain. So the browser is blocking it as it usually allows a request in the same origin for security reasons. You need to do something different when you want to do a cross-domain request.

Cross-Origin Resource Sharing (CORS) is a W3C spec that allows cross-domain communication from the browser. By building on top of the XMLHttpRequest object, CORS allows developers to work with the same idioms as same-domain requests.

You can always see this post to understand more on that. A CORS sample is given below.

function createCORSRequest(method, url) {
  var xhr = new XMLHttpRequest();
  if ("withCredentials" in xhr) {

    // Check if the XMLHttpRequest object has a "withCredentials" property.
    // "withCredentials" only exists on XMLHTTPRequest2 objects.
    xhr.open(method, url, true);

  } else if (typeof XDomainRequest != "undefined") {

    // Otherwise, check if XDomainRequest.
    // XDomainRequest only exists in IE, and is IE's way of making CORS requests.
    xhr = new XDomainRequest();
    xhr.open(method, url);

  } else {

    // Otherwise, CORS is not supported by the browser.
    xhr = null;

  }
  return xhr;
}

var xhr = createCORSRequest('GET', url);
if (!xhr) {
  throw new Error('CORS not supported');
}

This link has explained CORS very well.