There is such a page

<html> <head> <title>Title</title> </head> <body> <div id="ajax"> <input id="upfile" type="file" name="upfile"><br> <textarea id="description_area"></textarea><br> <button type="button" onclick="loadDoc()">Load Picture</button> </div> <button onclick="view()">Show Pre-View</button> <div id="view"> </div> <script src="script.js"></script> </body> </html>

And here is the script:

 var file=document.getElementById("upfile"), form=new FormData(); function loadDoc() { var up_file=file.files[0]; form.append("upfile",up_file); form.append("action","load_description_image"); var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { var text=document.createTextNode('\n[img]'+this.responseText+'[/img]\n'); document.getElementById('description_area').appendChild(text); } }; xhttp.open("POST", "start", true); xhttp.send(form); }

If you click on the button Load Picture, the lines are added. But as soon as I try to manually add some text and then click on the button, it ceases to be added. With what it can be connected?

    1 answer 1

     var text = '\n[img]' + this.responseText + '[/img]\n'; document.getElementById('description_area').value = document.getElementById('description_area').value + text;

    PS Please note that a file is added to the form every time.

    • Thank you. As for the form, I did not quite understand what you mean? - Nikita
    • form.append("upfile",up_file); - performed for the same form when the button is pressed again. - Igor