JS-Table-Editor to go together with json2html

[muellermichel]

I've had this idea on how to extend the simplicity of json2html for both read and write operations on the client side.

How about we'd build a JS based on jquery that

(a) runs over a json2html generated table (passing in a jquery selector) and wraps all text nodes except those that have been generated from a json dict key in input text elements. So the whole table becomes a form.

(b) adds a way to add new rows / subtables by allowing to copy a whole json2html generated structure and replace the text content with empty strings. This could be a rightclick-action on the background of the selected structure or some button inserted in a good place.

(c) adds a submit button at the end.

(d) when clicking submit it parses the table and basically does the reverse operation (html2json), so the server can get back a json. The whole implementation should work such that if the user doesn't edit anything, the posted json should be exactly the same as the one that was used to generate the html in the first place.

Now this would be quite a project, but imagine how cool it would be if you could have a configuration editor in your browser for any kind of JSON file and you wouldn't have to lift a finger other than installing json2html on the server and adding this Javascript to the response. It would be trivial to provide that json2html tooling as a Flask plugin as well at that point.

[akhiljay]

I quite like this idea, has there be any progress on this request?

[p-doyle]

I may have a similar solution that does what you describe with the exception of adding new rows/columns.. I am currently using it to allow values to be changed in the generated html table and then submitted. I can add some more detail if anyone is interested but basically you need to add contenteditable="true" to all of the table cells you want to be able to edit(requires manually editing jsonconv.py) and then create a js or jquery function that grabs the table html and posts it somewhere when a button is clicked. The last part is the html2json part that I had to make a custom function for. There is a html2json package on pip but if iirc it didn't seem to be working as intended with the html generated by json2html.