如何在没有 php 和 js 节点的本地 json 文件中保存 html 字段数据

Question

I am not talking only about form, any information panel in html that I want to save in local json file for eg- There is blocks in html

<div class="panel">
    <div>
    <input type="text" name="producttype" id="producttype" value="" placeholder="Product Type"/>
</div>
<div>
    <input type="text" name="productname" id="productname" value="" placeholder="Product Name"/>
</div>
<div>
    <input type="text" name="details" id="details" value="" placeholder="Details"/>
</div>
<div>
    <input type="submit" name="mysubmut" id="mysubmit" value="" />
    </div>
</div>
  

I want to save that above information in a separate local.json file, every time when I fill the above infirmation and click submit it automatically save in a local.json file without php and node js.... Is it possible??

Thanks In Advance

Answer 1

You will need some JavaScript to extract the data from the fields and change them into a json object. You cannot do this just with HTML.

If you're not using a form, I would suggest that you use the onchange event perhaps:

HTML:

<input type="text" name="input_name_one"  onchange="myFunction(this.name, this.value)">
<input type="text" name=“input_name_two”  onchange="myFunction(this.name, this.value)">

JS:

const obj = {};

function myFunction(key, val) {
    obj[key] = value;
}

//turn your object to a json string
const getJSONString = (obj) => {
    return JSON.stringify(obj);
}