如何在重新提交表单后保留以前的表单输入

时间:2015-07-18 17:15:28

标签: php html forms

我想制作一个联系人列表类型的交易,你点击一个按钮,一个新的输入被附加到一个表单,然后用php打印在页面上。但是,每次重新提交表单时,回显的先前输入值都会消失。我如何制作它,以便每当我重新提交表单时,php通过将输入添加到页面上而不替换回显的旧输入来回显输入?

<html>
<head>
    <title>Contacts</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="stylesheet3.css"/>
    <link rel="stylesheet" type="text/css" href="../bootstrap.css"/>
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="stylesheet4.css" type="text/css"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</head>
<?php
if (isset($_POST['submit'])) {
    $addresses = $_POST['apartments'];
    $units = $_POST['num_units'];
    for ($x = 0; $x < count($addresses); $x++) {
        echo $addresses[$x] . " " . $units[$x] . "<br><br>";
    }
}
?>
<body>

    <h3> </h3>
    <div id="button-container">
        <div id="button-container-container">
            <button id="add-button">
                <i id="add-icon" class="fa fa-plus-square fa-2x"></i>
            </button>
            <p>Add an apartment</p>
        </div>
        <input name="Edit" type="button" value='Save' id="edit_save-button">
    </div>
    <form action="" method="post" id="someform">
        <div id="labels">
            <div style="margin-left:0; margin-top:20px; text-align:left;">
                <p>Apartment Address</p>
            </div>
            <div style="margin-left:0; margin-top:-40px; text-indent:240px;">
                <p># of Units</p>
            </div>
        </div>
        <input type="submit" name="submit">
    </form>
    <script>
        $(function () {
            var template = "\
    <input name='apartments[]' type='text' placeholder='Apartment Address' class='new-apartment-input1'/>\n\
    <input name='num_units[]' type='text' placeholder='# of units' class='num_units'>\n\
    <br><br><br><br>",
                    index = $('input').length,
                    compiled_template;

            $('[name="Edit"]').on('click', function () {
                var prev = $('input'),
                        ro = prev.prop('readonly');
                prev.prop('readonly', !ro).focus();
                $(this).val(ro ? 'Save' : 'Edit');
            });

            $('#add-button').click(function () {
                compiled_textarea = $(template.replace("INDEX", index));
                $('#someform').append(compiled_textarea);
                index = index + 1;
            });
        });
    </script>
</body>

0 个答案:

没有答案