如何将HTML表单导出为CSV文件

Question

如何将HTML表单导出为CSV文件

4

我正在尝试创建一个表单，用户可以输入数据，然后当他们点击提交时，该数据将作为新行添加到存储在服务器上的csv文件中，我随后可以下载。我已经尝试了一些PHP和JavaScript，两者似乎都不错，但我对两者都不是很有经验。

以下是基本的HTML表单：

<form name="xyz_form">
    <section class="border-bottom">
<div class="content">
    <h3>ID Number</h3>
    <div class="form-control-group">
        <div class="form-control form-control-number">
            <input type="number" id="id_number">
        </div>
    </div>
            <h3>First Name</h3>
    <div class="form-control-group">
        <div class="form-control form-control-text">
            <input type="text" id="first_name">
        </div>
    </div>
</div><!--.content-->
    <section class="data-capture-buttons one-buttons">
       <div class="content">
          <input type="submit" value="Submit" onClick="javascript:addToCSVFile()">
       </div>
    </section><!--.data-capture-buttons-->

JavaScript代码位于HTML文件的头部，如下所示：

<script type="text/javascript">
        function addToCSVFile() {
            var csvData = new Array();  // To collect the names
            var csvFilePath = "Data.csv"; // File name

            // Collect General Information
            csvData[0] = document.getElementById('id_number').value;
            csvData[1] = document.getElementById('first_name').value;

              var fso = new ActiveXObject('Scripting.FileSystemObject');
            var oStream = fso.OpenTextFile(csvFilePath, 8, true, 0);
            oStream.WriteLine(csvData.join(','));
            oStream.Close();
            clearData();
            alert("Data Added Successfully");
     }

     function clearData() {
            document.getElementById('id_number').value = "";
            document.getElementById('first_name').value = "";
                     }
    </script>

“现在我有onClick="javascript:addToCSVFile()">，但是当我将表单操作设置为handler.php文件并且方法设置为post并删除onlick时，它也无法工作。这是php文件。”

   <?
    if(isset($_POST['match_scouting'])){
       $del = "\t";
     //Collect Info
     $data[1] = $_POST['id_number'];
     $data[2] = $_POST['first_name'];
    $file = fopen("Data.csv", "a");
    $data = "\r\n".implode($del, $data);
    fwrite($file, $data);
    fclose($file);
    echo "The data has been added successfully";
 }else{
   header("location: form.html");
 }
 ?>

如果我做错了，你能指点我走另外一个方向吗？不过，最终我想要做的是以某种方式保存表单数据，而我认为这比设置 SQL 数据库要容易些，因为我以前从未这样做过。

- user3204722

1

附注：您的表单没有方法，因此它将默认为GET。然后您正在使用POST变量，除非您使用method =“post”，否则不起作用。 - Funk Forty Niner

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Nicky Smits · Accepted Answer

这不需要应用任何JavaScript代码。只需向您的表单添加一个操作即可。

<form name="xyz_form" action="proces.php" method="get">

提交将会重定向到该PHP文件。该PHP文件应包含以下内容：

<?php
    $keys = array('id_number','first_name');
    $csv_line = array();
    foreach($keys as $key){
        array_push($csv_line,'' . $_GET[$key]);
    }
    $fname = 'file_to_write_to.csv';
    $csv_line = implode(',',$csv_line);
    if(!file_exists($fname)){$csv_line = "\r\n" . $csv_line;}
    $fcon = fopen($fname,'a');
    $fcontent = $csv_line;
    fwrite($fcon,$csv_line);
    fclose($fcon);
?>

$Keys 是您所有输入字段的名称，您可以添加任意数量的字段。 $fname 是您要写入的文件名。CSV 文件在表单提交时会添加新行。

如果您想强制下载文件，则可以参考此链接：使用 PHP 写入文本文件并强制下载。如果您想进行重定向而不是下载，则可以查看此链接：PHP 中如何进行重定向？您还可以添加：

echo file_get_contents($fname);

关于你的PHP