javascriptphphtmlphp-7.3parsedown

Trying to submit a HTML form to itself using PHP and JS and it's not working


I'm trying to make a form for posting articles to a news page using PHP. The goal is to write these articles in Markdown, store them in a database and parse them with Parsedown before displaying.

One idea I had was to add a Preview button that POSTs the form to its own page to display the parsed text before it's published (since the user isn't someone who uses Markdown regularly so she can check for mistakes before sending). In addition, I don't want the content of the fields to disappear when the button is clicked, so I want to insert the POST values back into them. This isn't working out, though.

    <div class="presentation">
        <form id="actuform" action="" style="text-align: center;">
            <label for="title">Title</label>
            <br>
            <input type="text" name="title" id="title" placeholder="Title" value=<?php echo '"'.$_POST['title'].'"'; ?> required>
            <br>
            <label for="content">Body</label>
            <br>
            <textarea class="actusub" name="content" id="content" placeholder="Body" style="width: 100%; max-width: 80%; min-height: 350px; resize: none;" required><?php echo $_POST['content']?></textarea>
            <br>
            <button type="button" onclick="handleSubmit(0)">Post</button>
            <button type="button" onclick="handleSubmit(1)">Preview</button>
        </form>
        <script>
            form = document.getElementById("actuform");
            function handleSubmit(choice) {
                if(choice==0){ 
                    form.action="actu_post.php"; // publish
                } else {
                    form.action=""; // preview
                };
                form.submit();
            }
        </script>
    
        <div"> <!--Markdown preview-->
            <?php
                $Parsedown = new Parsedown();
                $Parsedown->setSafeMode(true);
                echo $Parsedown->text($_POST['content']);
            ?>
        </div>
    </div>

When I run this, the URL shows the POST values, but the fields are blank and the preview does not appear. I'm unsure of how I should go about debugging this. Is there something obvious I'm missing?


Solution

  • You have to specify that the form is doing a POST request, if you do not then a GET request is made by default.

    <form method="POST" id="actuform" action="" style="text-align: center;">