AndrewStanton94/ajaxAndPhp.html

## ajaxAndPhp.html
<!DOCTYPE HTML>
<html>
	<head>
		<title>ds3e</title>
		<meta charset = 'UTF-8'>
		<link rel='icon' href='favicon.ico'>

		<script src='lib/ajaxget.js'></script>
		<script src='ds3e.js'></script>
	</head>

	<body>
		<h1>Dynasite 3e &ndash; First AJAX</h1>

		<div id=grabdiv>
			AJAX uploads go here.
		</div>

		<div id='grabphpdiv'>
			AJAX uploads from PHP go here.
		</div>
	</body>
</html>

## ajaxget.js
function AjaxGet(URL, callback)
{
    var ajaxObj = new XMLHttpRequest();

    ajaxObj.open("GET", URL, true);             // The True implies asynchronous

    ajaxObj.onreadystatechange = function()
        {
            if (ajaxObj.status == 200)
                if (ajaxObj.readyState == 4)
                    callback(ajaxObj.responseText);
        };

    ajaxObj.send(null);
}

## ds3e.js
function grabber (response) {
	document.getElementById('grabdiv').innerHTML = response;
}

function grabphp(response) {
    document.getElementById('grabphpdiv').innerHTML = response;
}

AjaxGet('datafile.txt', grabber);

AjaxGet('api/ds3e.php', grabphp);

## ds3e.php
<?php echo "This text was requested by AJAX and ECHOed by ds3e.php"; ?>

## ds3g.js
function showFileNames (respose) {
    console.log('respose = ' + respose);
    namearray = respose.split(',');
    console.log('namearray.length = ' + namearray.length);
    for (var namepile="", i=0; i<namearray.length; i++) {
        console.log('namearray[' + i + '] = ' + namearray[i]);
        var ni = namearray[i];
        if (ni.endsWith('.htm') || ni.endsWith('.html') || ni.endsWith('.php') || ni.endsWith('.js') || ni.endsWith('.txt'))
        {
            namepile = namepile + namearray[i] + "<br>";
            console.log('namepile#' + i + ' = ' + namepile);
        }
    }
    document.getElementById('filenamesdiv').innerHTML = namepile;
}

AjaxGet('api/getdir.php', showFileNames);

## getdir.php
<?php

$dir = opendir('../');
if (!$dir) {echo "Error: could not open directory"; exit;}

while ($name=readdir($dir)) {
    if (!is_dir($name) && !is_executable($name))
       echo "$name";
}

echo "-\r\n";
?>
	<!DOCTYPE HTML>
	<html>
	<head>
	<title>ds3e</title>
	<meta charset = 'UTF-8'>
	<link rel='icon' href='favicon.ico'>

	<script src='lib/ajaxget.js'></script>
	<script src='ds3e.js'></script>
	</head>

	<body>
	<h1>Dynasite 3e – First AJAX</h1>

	<div id=grabdiv>
	AJAX uploads go here.
	</div>

	<div id='grabphpdiv'>
	AJAX uploads from PHP go here.
	</div>
	</body>
	</html>
	function AjaxGet(URL, callback)
	{
	var ajaxObj = new XMLHttpRequest();

	ajaxObj.open("GET", URL, true); // The True implies asynchronous

	ajaxObj.onreadystatechange = function()
	{
	if (ajaxObj.status == 200)
	if (ajaxObj.readyState == 4)
	callback(ajaxObj.responseText);
	};

	ajaxObj.send(null);
	}
	function grabber (response) {
	document.getElementById('grabdiv').innerHTML = response;
	}

	function grabphp(response) {
	document.getElementById('grabphpdiv').innerHTML = response;
	}

	AjaxGet('datafile.txt', grabber);

	AjaxGet('api/ds3e.php', grabphp);
	function showFileNames (respose) {
	console.log('respose = ' + respose);
	namearray = respose.split(',');
	console.log('namearray.length = ' + namearray.length);
	for (var namepile="", i=0; i<namearray.length; i++) {
	console.log('namearray[' + i + '] = ' + namearray[i]);
	var ni = namearray[i];
	if (ni.endsWith('.htm') \|\| ni.endsWith('.html') \|\| ni.endsWith('.php') \|\| ni.endsWith('.js') \|\| ni.endsWith('.txt'))
	{
	namepile = namepile + namearray[i] + "<br>";
	console.log('namepile#' + i + ' = ' + namepile);
	}
	}
	document.getElementById('filenamesdiv').innerHTML = namepile;
	}

	AjaxGet('api/getdir.php', showFileNames);
	<?php

	$dir = opendir('../');
	if (!$dir) {echo "Error: could not open directory"; exit;}

	while ($name=readdir($dir)) {
	if (!is_dir($name) && !is_executable($name))
	echo "$name";
	}

	echo "-\r\n";
	?>