英文:
How to upload a csv to a JSP page and send the data in it to a MySQL database?
问题
我有一个 JSP 页面,用户可以使用 `<input type="file">` 上传 CSV 文件。我希望该 CSV 文件的内容能够存储到数据库中。我花了好几个小时搜索,只找到了关于在 PHP 中处理的方法,但我对 PHP 没有任何经验,因此非常感谢提供 Java 方面的任何帮助。
我的 JSP 页面:
<span>上传 CSV 文件:<input type="file"></span>
<table style="margin-left: 20px">
<tr>
<th class="table-custom">员工姓名</th>
<th class="table-custom">上班时间</th>
<th class="table-custom">下班时间</th>
</tr>
</table>
英文:
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>
答案1
得分: 1
尝试这段代码:
<!-- 开始代码段: js 隐藏: false 控制台: true babel: false -->
<!-- 语言: lang-js -->
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; // 跳过标题
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>';
}
<!-- 语言: lang-html -->
<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");
}
%>
我使用了这个问题并做了一些修改使其能够工作。您可以通过在 createForm JS 中移除 "type = hidden"
来在提交前查看内容。
英文:
Try this code
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
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>';
}
<!-- language: lang-html -->
<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>
<!-- end snippet -->
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.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论