如何使用JSP从上传的.csv文件自动更新表单文本字段？
[英]How to auto update a form textfield from a uploaded .csv file using JSP?
问题描述
我已经创建了用于创建表单的JSP文件。
我试图通过使用输入type = file标记上载.csv文件来自动更新或自动将数据打印到表单的文本字段中，然后使用JSP计算.csv文件中商品的总价。 那就是我必须将从.csv文件计算出的总价格打印到表单的文本字段中。
以下是JSP文件。
假设.csv文件仅包含1列，其中包含不同项目的价格。
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Insert title here</title> <link rel="stylesheet" href="../CSS/bootstrap.css"> </head> <body> <div class="row"> <div class="container"> <div class="col-md-2"></div> <div class="col-md-8"> <div class="form-area"> <form role="form" method="post" action="../AddDistributorDetail"> <br style="clear:both"> <h3 style="margin-bottom: 25px; text-align: center;">Distributor Registration</h3> <div class="form-group"> <label class="control-label">Distributor Name:</label> <input type="text" class="form-control" id="name" name="name" placeholder="Name" required> </div> <div class="form-group"> <label class="control-label">Contact No #1:</label> <input type="text" class="form-control" id="contact1" name="contact1" placeholder="Contact No1" required> </div> <div class="form-group"> <label class="control-label">Contact No #2:</label> <input type="text" class="form-control" id="contact2" name="contact2" placeholder="Contact No2" required> </div> <div class="form-group"> <label class="control-label">Address #1:</label> <textarea class="form-control" type="textarea" id="address1" placeholder="First Address" maxlength="200" rows="7"></textarea> </div> <div class="form-group"> <label class="control-label">Address #1:</label> <textarea class="form-control" type="textarea" id="address2" placeholder="Second Address" maxlength="200" rows="7"></textarea> </div> <div class="form-group"> <label class="control-label">City:</label> <input type="text" class="form-control" id="city" name="city" placeholder="City" required> </div> <div class="form-group"> <label class="control-label">Pincode:</label> <input type="text" class="form-control" id="pin" name="pin" placeholder="Pincode" required> </div> <div class="form-group"> <label class="control-label">Zone:</label> <div class="radio"> <label><input type="radio" name="zone">East</label> </div> <div class="radio"> <label><input type="radio" name="zone">South</label> </div> <div class="radio"> <label><input type="radio" name="zone">West</label> </div> <div class="radio"> <label><input type="radio" name="zone">North</label> </div> </div> <div class="form-group"> <label class="control-label">STB Limit:</label> <input type="text" class="form-control" id="stblimit" name="stblimit" placeholder="Set Top Box Limit" required> </div> <div class="form-group"> <label class="control-label">Credit Limit:</label> <input type="text" class="form-control" id="climit" name="climit" placeholder="Max Credit Limit" required> </div> <div class="form-group"> <label class="control-label">Upload STB Inventory</label> <input type="file" class=" file form-control" id="file_upload" name="file_upload" enctype="multipart/form-data" multiple required> </div> <div class="form-group"> <label class="control-label">Total Cost Of Inventory</label> <input type="text" class="form-control" id="tcost" name="tcost" placeholder="Total Cost Of Inventory" required> </div> <button type="button" id="submit" name="submit" class="btn btn-primary">Submit Form</button> </form> </div> </div> <div class="col-md-2"></div> </div> </div> <script type="text/javascript" src="../JS/jquery.js"></script> <script type="text/javascript" src="../JS/bootstrap.js"></script> </body> </html>
尽管我理解如何在JSP中读取csv文件，但我在互联网上进行搜索，但没有找到任何有关如何上传文件并实时计算总价格的逻辑（即，在同一JSP页面中，并且在单击之前提交按钮）并在表单中的文本字段中进行打印。
任何对此的帮助将不胜感激。
2 个解决方案
解决方案1
0 2015-11-20 14:06:04
您可以创建Pojo类并声明文件中存在的所有字段，然后从csv文件中读取字段，然后将其设置为可以映射到jsp字段的各个对象。
解决方案2
0 2015-11-20 18:44:20
您可以使用ajax表单提交上传文件。 上传后，在服务器端只需读取csv并将结果写回到响应中即可。 收到结果后，您可以操作dom元素。
更简单的方法是使用JavaScript“ FileReader” API，大多数浏览器都支持
<script type='text/javascript'>
var readFile = function(event) {
var input = event.target;
var reader = new FileReader();
reader.onload = function(){
document.getElementById("myTextarea").value =reader.result;
};
reader.readAsText(input.files[0]);
};
</script>
<body>
<input type='file' onchange='readFile(event)'><br>
<textarea id='myTextarea'></textarea>
</body>
Js小提琴链接： http : //jsfiddle.net/gtxfye8m/
我已经在Chrome边缘测试过。
如何使用jsp / java从csv文件的特定列读取数据？
[英]How to read data from a specific column from csv file using jsp/java?
如何使用jsp和servlet将多个csv文件上传到mysql数据库？
[英]How to uploading multiple csv file into mysql database using jsp and servlet?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.