LAHacks/ajaxreq.html at master · sbaum1994/LAHacks · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js"></script>
</head>

<script type="text/javascript">
	function PostData() {
	    // 1. Create XHR instance - Start
	    var xhr;
	    if (window.XMLHttpRequest) {
	        xhr = new XMLHttpRequest();
	    }
	    else if (window.ActiveXObject) {
	        xhr = new ActiveXObject("Msxml2.XMLHTTP");
	    }
	    else {
	        throw new Error("Ajax is not supported by this browser");
	    }
	    // 1. Create XHR instance - End

	    // 2. Define what to do when XHR feed you the response from the server - Start
	    // puts the response in div1
	    xhr.onreadystatechange = function () {
	        if (xhr.readyState === 4) {
	            if (xhr.status == 200 && xhr.status < 300) {
	            	var $jQueryObject = $($.parseHTML(xhr.response));
	            	var quote_arr = [];

//	            	$('#blogPagination').find('a').each(function() {
//    console.log($(this).attr('href'));
//});
	            	//$.jQueryObject.find(".quoteText").each(function() {
	            	//	quote_arr.push($(this));
	            	//})

	            	var quotes = $jQueryObject.map(function(){
	            		return $(this).find(".quoteText").map(function(){
	            			console.log($(this).html());
	            			quote_arr.push($(this).html());
	            			return $(this).html();
	            		}).get();
	            	}).get();
	            	//console.log(quotes);
	            	console.log(quote_arr);
	            	var ten_quotes = quote_arr.slice(1, 10);
	            	document.getElementById('div1').innerHTML = ten_quotes;
	                //document.getElementById('div1').innerHTML = $jQueryObject.find(".quoteText").html();
	            }
	        }
	    }
	    // 2. Define what to do when XHR feed you the response from the server - Start

	    var mood = document.getElementById("mood").value;

	    // 3. Specify your action, location and Send to the server - Start
	    xhr.open('POST', 'webscrape.php');
	    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	    xhr.send("mood=" + mood);
	    // 3. Specify your action, location and Send to the server - End
	}
</script>

<form>
    <label for="mood">Mood :</label>
    <input type="text" name ="mood" id="mood" onblur="PostData()" />
    <div id="div1"></div>
    <input type="button" value ="Check" onclick="PostData()" />
</form>