gregoire-bessagnet/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>HTTP Request MDR</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

</head>
<body>
<script src="script.js"></script>


  <div class="container">

  <title>Salut, c'est Evelyne Dhéliat !</title>
    <h1>Salut, c'est Evelyne Dhéliat !</h1>
    <h3>Je te donne la météo pour la ville de ton choix</h3>
<form>
    <input type="text" placeholder="Chercher pour" id="citytext">
    <button class="btn btn-default">Chercher</button>
</form>


    <div id="output">
      <!-- lieu ou s'affichera la carte -->
    </div>
</div>
</body>
</html>

## script.js
var city = "";

$(document).ready(function(){
	     $('button').click(function(){
		 var city = document.getElementById('citytext').value;
         console.log("stocke");
        request();
        console.log("lanace la fonction");
})});

function request() {

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (xhr.status === 200) {
        console.log("ca passe");
	    var data = JSON.parse(xhr.responseText);
    } else {
        console.log('Une erreur s’est produite.');
    }
    };

xhr.open("GET", "http://api.openweathermap.org/data/2.5/find?q=" + city + "&units=metric&APPID=c8b12079e9467ab075130e3b4a785750", true);
xhr.send(null);
// }};
	    };
};


// var push = document.getElementById("button");
// var buttonclicked = push.addEventListener("click", // retrieveText(), false);


// requete HTTP


// function qui affiche le reultat

// function readData(sData) {
	// var nodes = oData.getElementsByTagName("soft");
	//var ol = document.createElement("ol"), li, cn;

	//for (var i=0, c=nodes.length; i<c; i++) {
	//	li = document.createElement("li");
	//	cn = document.createTextNode(nodes[i].getAttribute("name"));

	//	li.appendChild(cn);
	//	ol.appendChild(li);
	// }

	// document.getElementById("output").appendChild(ol);
//};

// http://www.webdesignerdepot.com/2013/04/how-to-use-local-storage-for-javascript/
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>HTTP Request MDR</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
	<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

	</head>
	<body>
	<script src="script.js"></script>


	<div class="container">

	<title>Salut, c'est Evelyne Dhéliat !</title>
	<h1>Salut, c'est Evelyne Dhéliat !</h1>
	<h3>Je te donne la météo pour la ville de ton choix</h3>
	<form>
	<input type="text" placeholder="Chercher pour" id="citytext">
	<button class="btn btn-default">Chercher</button>
	</form>


	<div id="output">
	<!-- lieu ou s'affichera la carte -->
	</div>
	</div>
	</body>
	</html>
	var city = "";

	$(document).ready(function(){
	$('button').click(function(){
	var city = document.getElementById('citytext').value;
	console.log("stocke");
	request();
	console.log("lanace la fonction");
	})});

	function request() {

	var xhr = new XMLHttpRequest();

	xhr.onreadystatechange = function() {
	if (xhr.readyState === XMLHttpRequest.DONE) {
	if (xhr.status === 200) {
	console.log("ca passe");
	var data = JSON.parse(xhr.responseText);
	} else {
	console.log('Une erreur s’est produite.');
	}
	};

	xhr.open("GET", "http://api.openweathermap.org/data/2.5/find?q=" + city + "&units=metric&APPID=c8b12079e9467ab075130e3b4a785750", true);
	xhr.send(null);
	// }};
	};
	};


	// var push = document.getElementById("button");
	// var buttonclicked = push.addEventListener("click", // retrieveText(), false);


	// requete HTTP



	// function qui affiche le reultat

	// function readData(sData) {
	// var nodes = oData.getElementsByTagName("soft");
	//var ol = document.createElement("ol"), li, cn;

	//for (var i=0, c=nodes.length; i<c; i++) {
	// li = document.createElement("li");
	// cn = document.createTextNode(nodes[i].getAttribute("name"));

	// li.appendChild(cn);
	// ol.appendChild(li);
	// }

	// document.getElementById("output").appendChild(ol);
	//};

	// http://www.webdesignerdepot.com/2013/04/how-to-use-local-storage-for-javascript/