如何将数据从一个表单发布到另一个表单

时间:2015-10-30 16:56:34

标签: javascript jquery forms iframe

我在这里要做的就是获取一个表单的表单输入并将其提交给链接到iFrame的另一个表单。这样做的目的是访问者可以预览他在iframe中选择的汽车,如果快乐按下保存一个表格并完成。

我觉得我差点接近,但我无法确定如何将数据从表格1发送到iFrame帖子,并且无法找到有关如何执行此操作的任何答案。我有一个单一的表单版本,如下所示,但不能从表单中提取数据提交到iFrame

<x>
  <y>
    <z></z>
  </y>
  <payload></payload>
</x>

1 个答案:

答案 0 :(得分:0)

这有点脏,但如果您需要在iFrame中进行,它可以正常工作。您的预览框当前只是一个表单元素,您基本上在其中附加查询字符串文本。如果您想将其实际发送到iframe本身,则需要解析输入并将其提交到目标iFrame中的预览页面。您可以使用静态命名输入,如果您知道它们将始终存在,或者如果有其他输入无法预测,您可以让JS动态生成隐藏的输入元素。

在form.php中

<form action="save.php" method="post" id="save">

    <input type="text" name="firstname" placeholder="firstname">
    <input type="text" name="carname" placeholder="carname">
    <input type="text" name="cartype" placeholder="cartype">

    <button type="submit" name="save">
        Save
    </button>
    <button id="preview">
        Preview
    </button>
</form>

<form action="preview.php"  target="iframe" method="post" id="iframebox">
    <input type="hidden" name="firstname">
    <input type="hidden" name="carname">
    <input type="hidden" name="cartype">
</form>

<iframe name="iframe" src="preview.php" ></iframe>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
    $('#preview').click(function(e) {
        e.preventDefault();
        $("#save input").each(function(index, value){
            $('#iframebox input[name="' + value.name + '"]').val(value.value);
        });
        $('#iframebox').submit();
        return false;
    });
</script>

在preview.php中

    <ul>
        <li>
            First Name : <?php echo $_POST['firstname'] ? : "N/A"; ?>
        </li>
        <li>
            Car Name : <?php echo $_POST['carname'] ? : "N/A"; ?>
        </li>
        <li>
            Car Type : <?php echo $_POST['cartype'] ? : "N/A"; ?>
        </li>
    </ul>