Question

I want to upload a csv file asynchronously to backend and display the preview data in same page without refreshing/reloading the page. So I want to do it using AJAX.

I am wondering how can we do this using Ajax and Jquery. I am using struts2. Is there any plug-ins available for struts2?

Any help on this regard is really appreciated.

Answer 1

check out Struts2-jQuery-Plugin. then simply do this:

<s:form action="process-csv">
    <s:file name="fileName"/>
    <sj:submit targets="csvDiv"/>
</s:form>
<sj:div id="csvDiv"/>

in your Action process-csv, you should read the uploaded file, and output it, then it will show in the div with id="csvDiv".

please try this out, if you got further questions, post again.

UPDATE
Form:

<s:form action="process-csv">
    <s:file name="fileName"/>
    <sj:submit targets="csvDiv"/>
</s:form>
<sj:div id="csvDiv"/>  

Action Class:

public class ProcessCsv {
    private File fileName;//getter + setter
    private String content;// getter + setter
    public String execute(){
        content = parseCsv(fileName);
        return SUCCESS;
    }
}

You can use library like OpenCsv to implement parseCsv()
on your test.jsp, you only need this:

<textarea><s:property value="%{content}"/></textarea>