如何使html文件包含自身，而不在每次单击按钮或链接时刷新页面？

Question

Beginner's question here :

file #1 : file1.html (one dataset)

//header, body and some other stuff
<form action="some_logic.php">
    <input type="text" name="data1" placeholder="data1">
    <input type="text" name="data2" placeholder="data2">
    <input type="submit" value="Ok!">       
</form>
//end of the html

file #2 : (I don't even know what this file should be : php? html? js?)

//usual stuff
    include 'file1.html';     //OR
    <!--#include file="file1.html"-->
    #logic to replicate file1.html with a button

I need to have the file1's code repeated once each time the user clicks on a button (or a link or whatever) and I would like this to work without refreshing the page (or at least without questionning the server over and over and without deleting the current datas). The server uses php7.

I need this because I do not know in advance how much datasets the user will create. It would be awesome if this could be done with javascript! (since I doubt this can be achieved with php/html only) Although I have never used js until now.

Answer 1

You can fetch data from server without refreshing the webpage using JavaScript Ajax. Here you can create an event listener to send a request to the server. The data can be plain text, html, json, xml or whatever you want. Just create Ajax request for events. Then update the webpage using the response data.