Need assistance with PHP and my HTML5 form

Question

I used an anchor tag for my submit button so I think that this is probably why I'm having so much trouble trying to figure this out.

I'm not sure if it's the "href" that is messing it all up. I also would like some assistance with server side validation, not having a lot of experience in PHP, I was only able to validate using JavaScript.

<form id="myform" method="post" name="contact_form" action="process.php">

    <input id="cname" type="text" name="name" minlength="2" placeholder="Full Name" class="form-control" required>

    <input id="cemail" type="email" name="email" placeholder="Email Address" class="form-control" required>

    <textarea id="ccomment" rows="5" name="message" placeholder="Message..." class="form-control" required></textarea>

    <div id="send-btn">
        <a href="process.php" onClick="$(this).closest('form').submit();" class="btn btn-lg btn-general btn-white" role="button" name="submit">SEND</a>
        <asp:Button runat="server" Text="submit"/>
    </div>

</form>

This below is my PHP code. Please assist with validations and making it work with an anchor tag. I could have messed up the form somewhere.

<?php ob_start();


if (isset($_POST['submit'])) {

    $to = "someoneelse@someone.com";
    $name = $_POST['name'];
    $email = $_POST['email'];
    $txt = $_POST['message'];
    $headers = "From: .$email" . "\r\n" .

    mail($to,$email,$txt,$headers);
    header("Location: index.html");
}


?>

NO NO NO! **DON'T** set `href` in the anchor tag to anything other than `javascript: void(0)` or `#`! — , Apr 07 '17 at 02:50
How about searching google for some tutorials on the validation? Some hints: [PHP filters](http://php.net/manual/en/filter.filters.validate.php), using a proper mailer [PHPMailer](https://github.com/PHPMailer/PHPMailer), [check string length](http://php.net/manual/de/function.strlen.php)... — Yolo, Apr 07 '17 at 02:53
Not positive, but don't you also need a mailing server (smtp) to do this? — , Apr 07 '17 at 02:55

score 0 · Answer 1 · answered Apr 07 '17 at 02:52

As said in the comment you just need:

<a href="javascript:void(0)" onClick="$(this).closest('form').submit();" class="btn btn-lg btn-general btn-white" role="button" name="submit">SEND</a>

Small explanation javascript: void(0) or #

If you use javascript: void(0) when you click on the a element the browser will try to run a function called void(0) which should be undefined and do nothing but skip to your onClick.

Instead if you use the # syntax the browser will jump to the top of the page because is looking for some tag with the attribute id empty.

score 0 · Accepted Answer · edited May 23 '17 at 12:25

Ideally, with modern Javascript you would avoid having any script in your markup and would attach the click event using jquery and prevent the default action for the anchor tag using preventDefault. (See https://api.jquery.com/click/ and https://api.jquery.com/event.preventDefault/ )

However, if you are going to use an onclick attribute, you need to return false. If the onclick event returns false, then the browser will cancel the default action.

<a href="#" onclick="$('#myform').submit(); return false;" class="btn btn-lg btn-general btn-white" role="button" name="submit">SEND</a>

When the anchor link is clicked, the javascript to submit the form will run, but the return false will prevent the link from being followed. The return false will also prevent the browser from jumping to the top when you use a # in your href.

As for server side validation in PHP, you will need to use conditional statements to check that the posted variables match a pattern. See How to validate an email address in PHP .

score 0 · Answer 3 · answered Apr 08 '17 at 05:21

I did as instructed in the anchor tag. The other issue now is nothing happens when I click on submit, is my php code incorrect?

                  <form id="myform" method="post" name="contact_form" action="process.php">

                            <input id="cname" type="text" name="name" minlength="2" placeholder="Full Name" class="form-control" required>

                            <input id="cemail" type="email" name="email" placeholder="Email Address" class="form-control" required>

                            <textarea id="ccomment" rows="5" name="message" placeholder="Message..." class="form-control" required></textarea>

                            <div id="send-btn">
                           <a href="javascript:void(0)" onClick="$(this).closest('form').submit();" class="btn btn-lg btn-general btn-white" role="button" name="submit">SEND</a>
                            <asp:Button runat="server" Text="submit">
                            </div>

                        </form>

Need assistance with PHP and my HTML5 form

3 Answers3