Hey so I have a text area in my HTML and whenever I you click on a file name in the list it puts the contents of the file in that text area, it works great clicking back and forth between files. As soon as i edit something within the textarea then go try to click the file names again it just doesn’t do anything or update that text area anymore.
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
var currentFile;
$(document).ready(function()
{
var request = new XMLHttpRequest();
request.open("GET", "getFiles.php", false);
request.send();
var result = request.responseText;
$("#fileNames").html(request.responseText);
});
$(document).ready(function()
{
$("li").click(function()
{
currentFile = $(this).text();
$("#currentFile").text(currentFile);
var request = new XMLHttpRequest();
request.open("GET", "getFileContents.php?fileName="+currentFile, false);
request.send();
var result = request.responseText;
$("#fileContents").text(result);
});
});
function saveFile()
{
var request = new XMLHttpRequest();
var contents = $("#fileContents").text();
request.open("GET", "saveFile.php?fileName="+currentFile+"&fileContents="+contents, false);
request.send();
}
</script>
<style type="text/css">
ul.fileList li
{
background-color:blue;
}
#fileContents
{
resize: none;
}
</style>
</head>
<body>
<div id="currentFile">No File Selected</div
<br />
<ul id="fileNames" class="fileList">
</ul>
<br />
<textarea id="fileContents" cols="25" rows="5">No Contents</textarea>
<input type="button" onclick="saveFile();" value="Save" />
</body>
</html>
You should use
.val()to get and set the text in a textarea