CODEWITHSUNDEEP
javamysqljsp
pokerface0958
pokerface0958

Reputation: 85

How to upload a csv to a JSP page and send the data in it to a MySQL database?

I have a JSP where a user can upload a csv using input type="file". I want the content in that csv to go to a database. I searched for hours and only found methods in php for this, but I have zero experience in php, so any help in java is appreciated.

My JSP:

<span>Upload CSV : <input type="file"></span>

<table style="margin-left: 20px">
                            <tr>
                                <th class="table-custom">Employee Name</th>
                                <th class="table-custom">In Time</th>
                                <th class="table-custom">Out Time</th>

                            </tr>
</table>

Upvotes: 0

Views: 723

Answers (1)

Hisham Bawa
Hisham Bawa

Reputation: 438

Try this code

document.getElementById("upload").addEventListener("change", upload, false);
var out = "";

function upload(e) {
  document.getElementById('csvForm').innerHTML = "";

  var data = null;
  var file = e.target.files[0];

  var reader = new FileReader();
  reader.readAsText(file);
  reader.onload = function(event) {
    var csvData = event.target.result;
    var parsedCSV = d3.csv.parseRows(csvData);

    parsedCSV.forEach(function(d, i) {
      if (i == 0) return true; // skip the header
      if (d.constructor === Array) {
        createForm(d);
      }
    });

  }
}

function createForm(csv) {

  out += '<input value="' + csv[0] + '" name="date" type="hidden">';
  out += '<input value="' + csv[1] + '" name="name" type="hidden">';
  out += '<input value="' + csv[2] + '" name="in-time" type="hidden">';
  out += '<input value="' + csv[3] + '" name="out-time" type="hidden">';

  document.getElementById('csvForm').innerHTML = out;
  document.getElementById('csvForm').setAttribute("formmethod", "post");
  document.getElementById('csvForm').setAttribute("formaction", "testBrain.jsp");
  out += '<br>';
}
<input id="upload" type="file">

<form id="csvForm"></form>
<input type="submit" value="submit" form="csvForm" formmethod="post" formaction="testBrain.jsp">

<script src="https://d3js.org/d3.v3.js"></script>

testBrain.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import="java.sql.*,java.util.*"%>

<html>
<head>
    <meta http-equiv="Refresh" content="5;url=test.jsp">
</head>
</html>
<%
    String[] date=request.getParameterValues("date");
    String[] name=request.getParameterValues("name");
    String[] inTime=request.getParameterValues("in-time");
    String[] outTime=request.getParameterValues("out-time");

    try
    {
        Class.forName("com.mysql.jdbc.Driver");
        Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/testDb", "root", "1234");
        Statement st=conn.createStatement();

        for(int x=0; x<name.length;x++) {
            int i = st.executeUpdate("insert into csv(date,name,`in`,`out`)values('" + date[x] + "','" + name[x] + "','" + inTime[x] + "','" + outTime[x] + "')");
        }
        out.println("Data is successfully inserted! Redirecting.. Please wait");

       // String redirectURL = "test.jsp";
       // response.sendRedirect(redirectURL);

    }
    catch(Exception e)
    {
        System.out.print(e);
        e.printStackTrace();
        out.println("Error");
    }
%>

I used this question and changed some stuff for it to work. You can view the content before submitting it by removing the "type = hidden" in the createForm JS.

Upvotes: 1

Related Questions