I am trying to output the response I get from a remote server (bash script, simple ping) to a text a file so I can output it line by line dynamically to the webpage. Currently, I have working code to output a text file to the webpage dynamically (outputToPageDynamic.html), I also have working code to get the response from the remote server (testexe.php). I just need to combine these two.
So I was thinking if I output the response from the remote server to a text file on my webserver I can output this text file dynamically to the webpage to the user.
Do you know how I can output my response to a text file?
Here is what I have so far:
testexe.php (get response from remote server):
<!DOCTYPE html>
<html>
<head>
<style>
.box1 {
width: 450px;
border: 2px solid black;
margin: 0;
display: flex;
}
.col {
display: inline-block;
border-right: 2px solid black;
padding: 5px;
width: 200px;
}
.col:last-child {
border-right: none;
}
input[type=text], select {
width: 20%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
background-color: #ffffff;
}
</style>
</head>
<body>
<div id="gatewayInput">
<form method="post">
<input type="text" id="gateway" name="gateway" placeholder="Gateway Name"><br><br>
<?php
include("search.php"); //this does a search to auto complete
?>
</div>
<div class="box1">
<label class="col">Up/Down</label>
<span class="col">
<input type="radio" name="option" id="r1" value="1" />
<label for="r1">Up</label>
<input type="radio" name="option" id="r2" value="2" />
<label for="r2">Down</label>
</span>
<span class="col">
<input type="submit" class="button" name="submit"/>
</span>
</form>
</div>
<script src ="../../../jqueryDir/jquery-3.2.1.min.js"></script>
<script src ="../../../jqueryDir/jquery-ui.min.js"></script>
<script type="text/javascript">
//auto seatch function
$(function() {
$( "#gateway" ).autocomplete({
source: 'search.php'
});
});
//button click function
$(".button").click(function(event){
if ((document.getElementsByName("gateway")[0].value == '')) {
alert('Gateway Required!');
return false;
}
else if (document.querySelectorAll('input[type="radio"]:checked').length < 1) {
alert('Please Choose Up/Down Value!');
return false;
}
else {
//alert('Sucess!');
event.preventDefault();
$.ajax({
url:"testexe.php",
type: "POST",
data: {
gateway: $("#gateway").val(),
option: $('input[type=radio]:checked').val()
},
dataType: "text",
success:function(result){
$('#div1').html(result) //instead of send the result to the page i need to output to text
}
});
return true;
}
});
</script>
<div id="div1"></div>
</body>
</html>
outputToPageDynamic.html:
<!DOCTYPE html>
<html>
<body>
<div>
<textarea id="target" cols="80" rows="20">Loading...</textarea>
</div>
<script src="http://code.jquery.com/jquery-2.2.4.min.js"></script>
<script type="text/javascript">
var checkInterval = 1; // check interval, in seconds
var fileToCheck = "ping.txt"; //here I need to read the text file I get from the ajax output
var lastData;
function checkFile() {
$.get(fileToCheck, function (data) {
// Update the text if it has changed
if (lastData !== data) {
$( "#target" ).val( data );
$( "#target" ).animate({
scrollTop: $( "#target" )[0].scrollHeight - $( "#target" ).height()
}, 'slow');
lastData = data;
}
});
}
$(document).ready(function () {
setInterval(checkFile, 1000 * checkInterval);
});
</script>
</body>
</html>