what are good UI ways for editing xml files in web pages?

Question

I have an xml file which contain a lot fields and sub fields, I am not sure yet, but around 100 or 200 of fields.
Fields value types may need true/false , others need drop down to select from, and others free text and some just numeric values.

My questions is:
From the user and usability point of view, what will be the best UI to let users manipulate this xml file from a webpage.

Also if you know samples to show me this will be good as well, I don't want code I just want to know how it should look like based on your experience.

Answer 1

Editing a raw xml file is never (from my point of view) a good usability practice because this is error prone, even when the user is known to xml (imagine missing quotes, forgotten closing xml elements) and it's quite hard to give the user useful feedback in case validation fails.

I'd use some tree like visualization structure with a bunch of javascript to provide a nice user experience. With this approach you can enforce validation constraints before the user posts the edited xml file which leads to less error conditions that can arise when posting the data.

Answer 2

In short, it depends on the user. Considering that the user editing the XML file is probably advanced and fluent in XML, the best way is probably to load the XML file in an editor like ace, and then have the user edit the XML file by hand, with maybe some auto completion.

However, if the user is not fluent in XML, displaying listboxes will probably be your best option, as they are simple and do not require much experience.