javascript - different data in different json file. How to load them -

i have 2 different json files (marker.json , marker.json0) contain different coordinates(latitude , longitude) , need load them renaming .json0 .json (and former .json .json0) different data contained in former .json0 .json parsed in javascript file handles ajax request causes markers , infowindow displayed on map.

1. this javascript file handles asyncronous loading of json array. there 2 functions search , remove. both of them fired whenever user click "cerca" or "cancella" button purpose different. searchaddress parses json array inside loop markers , infowindow visible while removeaddress deletes them map, need click "cerca" button again recreate markers , infowindow time belong new json file on webserver renamed .json extension used in js file. last edit builds function handle ajax request , @ end of code load both of json files still markers go on same coords. have deleted global variables , have tried use arguments define variables inside function. no solution found yet

edit js file

var map;    function initialize() {    var mapoptions = {      zoom: 16,      center: new google.maps.latlng(41.898055, 12.515112)    };    map = new google.maps.map(document.getelementbyid('map-canvas'),        mapoptions);  }    google.maps.event.adddomlistener(window, 'load', initialize);    function get(url) {   var xmlhttp = new xmlhttprequest();  console.log(url);  arr;     xmlhttp.onreadystatechange=function() {      if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {          arr = json.parse(xmlhttp.responsetext);      }  }  xmlhttp.open("get", url, true);  xmlhttp.send();        function markers(arr) {  	var infowindow = [];      var marker = [];    	function searchaddress(){      for(var = 0; < arr.length; i++) {  		console.log(arr);              (function(i){ //new line               infowindow[i] = new google.maps.infowindow({                  title: arr[i].title,  				content: arr[i].content              });              marker[i] = new google.maps.marker({                      title: arr[i].title,  					icon: arr[i].icon,  					size: arr[i].size,  					coords: arr[i].coords,  					type: arr[i].type,  					draggable: false,  					//map: map,                      animation: google.maps.animation.drop,                      //animation: google.maps.animation.bounce,                                              position: new google.maps.latlng(arr[i].latitude,arr[i].longitude)                  });  			   marker[i].setmap(map)                  google.maps.event.addlistener(marker[i], 'click', function() {  			                 infowindow[i].open(map,this);              });              })(i); //new line      }  }    // sets map on markers in array.  function setallmap(map) {    (var = 0; < marker.length; i++) {      marker[i].setmap(map);    }  }    function removeaddress(){  	setallmap(null);  	prevarr = arr.slice();  }     }    markers = get("http://89.97.214.162/accessibilita    json/marker_json1.json");  markers.concat(get("http://89.97.214.162/accessibilita/json/marker_json2.json"));

---

---

new javascript errors occured after editing code:

1. typeerror: markers undefined
2. referenceerror: searchaddress not defined (this error occurs whene click on "cerca" button whenever clicked should fire onclick event

---

---

2. this first json array contains latitudes, longitudes, title , content parsed in js array map able retrieve them , show required information (.json)

[  {  "title": "paolo",   "latitude": 41.897115,  "longitude": 12.513300,  "content": "cooperativa fornitrice di servizi sociali,<br/> viale eleonora d'arborea 12<br/> 00162 roma<br/> <a href='http://www.prassiericerca.com' target='_blank'>prassi e ricerca</a>",  "icon": "img/orange-dot.png",  "coords": "1, 1, 1, 20, 18, 20, 18 , 1",  "type": "poly"  },  {  "title": "galasso",   "latitude": 41.897379,  "longitude": 12.513272,  "content": "penelope e altri servizi <a href='http://www.borghiartistici.com' target='_blank'>borghi artistici s.r.l.</a>",  "icon": "img/green-dot.png",  "coords": "1, 1, 1, 20, 18, 20, 18 , 1",  "type": "poly"  },  ........  ]

3. this second json array containing new information supposed loaded whenever file renamed .json1 .json , other .json .json1 json file loading handled in js file

[  {  "title": "bar dei pini",   "latitude": 41.897115,  "longitude": 12.513300,  "content": "specialita gelato artigianale<br/> viale eleonora d'arborea 12<br/> 00162 roma<br/> <a href='http://www.prassiericerca.com' target='_blank'>prassi e ricerca</a>",  "icon": "img/pink-dot.png",  "coords": "1, 1, 1, 20, 18, 20, 18 , 1",  "type": "poly"  },  {  "title": "alimentari san lorenzo",   "latitude": 41.897379,  "longitude": 12.513272,  "content": "specialita calabresi<a href='http://www.borghiartistici.com' target='_blank'>borghi artistici s.r.l.</a>",  "icon": "img/green-dot.png",  "coords": "1, 1, 1, 20, 18, 20, 18 , 1",  "type": "poly"  },  ........  ]

as matter of fact pages not need reloaded because 2 json files renamed long @ least 1 of 2 .json

it simpler if didn't rename anything. since xmlhttprequest client-side operation, not have access renaming files on server, such json1.json. preventing making code gets json function argument url?

function get(url){   var xmlhttp = new xmlhttprequest();   console.log(url);   var arr;     xmlhttp.onreadystatechange=function() {     if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {       arr = json.parse(xmlhttp.responsetext);     }   }   xmlhttp.open("get", url, true);   xmlhttp.send();   return arr; } 

this way, can files ever need. do:

markers = get("http://www.example.com/json1.json"); markers.concat(get("http://www.example.com/json2.json")); 

or that.

and similar thing can done marker code. after put in function, can submit markers variable argument function, , display them on map.

essentially, try break code functions a) can flow more , b) reuse same code.