使用JSON对象填充HTML表单字段

时间:2015-06-25 14:55:59

标签: html json forms

我有一个非常基本的HTML表单,我在本地创建了另一个表单,同一个表单,在另一个本地站点上。

我想知道是否有办法填写第一个HTML表单,然后使用相同的数据自动填写第二个表单。

我已经研究过可能将表单数据打包成JSON对象,但似乎无法找到关于如何实际执行此操作的良好指导。

<!DOCTYPE html>
<html lang="en">

<head>
    <link rel="stylesheet" type="text/css" href="main.css">
    <title>Form Test</title>
</head>

<body>
    <center>
        <h1>Form Test</h1></center>
    <div class="navigation">
        <nav>
            <a href="secondform.html">Second Form Submission</a>
        </nav>
    </div>

    <p>Upon clicking the submit button, the populated fields should send their field data to the Second Form which will then be emailed to someone.</p>

</body>
<div id="message"> </div>
<form name="form_simple" id="form-simple" action="C:/xampp/htdocs/formsubmit/formsubmit.php" method="post" target="_blank">
    Name:
    <br>
    <input type="text" name="name" value="">
    <br> Email:
    <br>
    <input type="email" name="email" value="">
    <br> University:
    <br>
    <input type="text" name="university" value="">
    <br> Year In School:
    <br>
    <input type="text" name="year" value="">
    <br> Grad Date:
    <br>
    <input type="date" name="graddate" value="">
    <br>
    <br>
    <input type="submit" value="Submit">
</form>

</html>

1 个答案:

答案 0 :(得分:0)

由于您使用的是php,因此无需使用JSON编码数据。点击提交按钮后,会请求formsubmit.php页面。

在其中,您可以获取表单所包含的所有数据。然后,您可以使用它来填充下一个表单的字段。

我想你还不熟悉每个php脚本可用的$ _POST和$ _GET数组。由于上述表单的方法是POST,因此您可以从$ _POST数组中获取提交的值。

也就是说,此数组将包含一个数组中的元素,该数组使用原始表单输入的 name 进行索引。在您的情况下,可以在$_POST['name']$_POST['email']$_POST['university']$_POST['year']$_POST['graddate']中找到这些内容。

现在也是提及您不应该在表单的action属性中包含脚本的完整本地路径的好时机。只需相对于Web服务器的根文件夹来引用它。在您的情况下,这是c:/xampp/htdocs - 这相当于浏览器中localhost/的地址。因此,如果上面显示的html和php文件都存在于同一文件夹中,您应该将操作更改为/formsubmit/formsubmit.php或简单地formsubmit.php

您可能会发现使用的其他功能是var_dump功能。如果您将var_dump($_POST);放在formsubmit.php文件中,您可以直接在屏幕上看到输入的值 - 这是一个有用的调试工具,可让您检查您认为通过POST发送的内容实际上是已发送,并且它按照您的预期进行了命名和结构化。 您可以通过检索然后回显传递的数据来轻松填充目标表单上的字段。

不执行错误检查但没有样式的示例是惰性的,并且填充两个字段可能如下所示:

<强> formsubmit.php

<?php
  $name = $_POST['name'];
  $email = $_POST['email'];
?>
<html>
<body>
  <form>
    <input type='text' name='nameInput' value='<?php echo $name; ?>' />
    <input type='email' name='emailInput' value='<?php echo $email; ?>' />
  </form>
</body>
</html>