Saving form data as JSON in to local machine - DOJO based UI
We are having a Liferay based portal application. In one of the portlet, we have developed the UI using DOJO components. I would like to get some suggestions for implementing the following functionality.
Save to Local This functionality helps the user to save the form data to the local machine. How to achieve this part ? Here is the approach I am thinking of.
- Form data can be saved as JSON.
- Attach onchange event to all the UI components and construct a JSON oject which holds the ui component id and value.
- Serialize the whole JSON structure by using toJSON method of DOJO librar开发者_Go百科y when the user clicks on Save to Local. But I have few questions here. Q1.How can I open a save dialog box so that, user can select the directory path and assign the name of the file.There is no server interaction happens in this flow. Invocation of Save Dialog box can happen from the client (ie. from java script). Q2. Is it possible to save the form data to local machine without any server interaction or not ? ie. For saving the data into local,if I post the form data to server through AJAX and then receives the response as JSON hyper link, then is it possible ?
Load from Local. On click of this button saved JSON data will be loaded to the UI and form values has to be set ? Q1. How can I open a file dialog for choosing the JSON file and parse the data ? I think fromJSON can be used for parsing a JSON string and construct the JSON object. But can I read from the local file ?
I think the server interaction is required for the Save to Local scenario. When the user clicks the save button, the form data is retrieved by iterating all the widgets or using dojo.formToJson
. Then the serialized JSON string is posted to the server and the server returns a URL with appropriate HTTP headers for the browser to download.
For the Load from Local scenario, you can add a file input in the page to allow user to upload the JSON file. After the file is uploaded successfully, the client can send a request to the server to retrieve the JSON data using XMLHTTPRequest, then use the data to set the values of the controls.
精彩评论