0

I want to make a contact list type deal where you click a button and a new input is appended to a form, and then it is printed on the page with php. However, every time I resubmit the form the previous input values that are echoed disappear. How do I make it so that whenever I resubmit the form, the php echoes the inputs by adding it onto the page without replacing the older inputs that were echoed? 

<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>

MadSkills88
  • 11
  • 4
  • Use localStorage or sessionStorage. No server needed. – Madara's Ghost Jul 18 '15 at 17:16
  • possible duplicate of [Keep values selected after form submission](http://stackoverflow.com/questions/2246227/keep-values-selected-after-form-submission) – jaunt Jul 18 '15 at 17:17
  • something along the lines of **** should do it as you're posting to the same page – ggdx Jul 18 '15 at 17:37
  • Can't believe no-one else has mentioned this,but what on earth is that php block doing between your head and your body? You can't output that stuff there. Do it inside the body if you wish to see it. Also, rather than submitting the form on the page back to the same page, why not just use AJAX? Send the new data, catch and proces it in the PHP, send a response to the JS. If the result is favourable, add the contents of the current inputs to the current page. Output from the php could be JSON encoded, allowing you to return an object. Perhaps something like `{status: 'success', lastIndex: 4}` – enhzflep Jul 18 '15 at 21:40

1 Answers1

-1

echo "

document.getElementById('en_name').value = '".$_POST['en_name']."';";
RAAFAT ALJABR
  • 1
  • 1
  • 2
    Welcome to Stack Overflow! I do not see how this answers the question at the top of this page, but it should. Please [edit] according to [answer] or delete the answer. Otherwise it risks being flagged as "not an answer" and being deleted. – Yunnosch Jun 04 '22 at 20:32