PHP form handling- display error message using javascript

Question

I have a form.php file that redirects to a sendformdata.php file when I submit the form. However, I can't get the sendformdata.php file to display an error message within the form when the proper fields aren't filled out.

I am simply redirected to the include file, db_connect.php, which shows up as a blank page. How can I get the page to stay on form.php and display an error message in html? This is my current sendformdata.php file:

<?php

include_once('db_connect.php');



$lokotitle = $description = $category = $showyourname = $yourname = $lat = $lng = "";


if($_SERVER['REQUEST_METHOD'] == 'POST'){


  $lokotitle=$_POST['lokotitle'];
  $description=$_POST['description'];
  $category=$_POST['category'];
  $showyourname=$_POST['showyourname'];
  $yourname=$_POST['yourname'];
  $lat=$_POST['lat'];
  $lng=$_POST['lng'];




  // Validation will be added here   


  if(empty($lokotitle)) {
    $error_message = "Please input a Loko title.";
    ?><script>$('#notitle'.text($error_message));</script><?php
    exit;
  }


  if(!isset($error_message)){

    //Inserting record in table using INSERT query

    $insqDbtb="INSERT INTO `new`.`web_form`
    (`lokotitle`, `description`, `category`, `showyourname`, `yourname`, `lat`, `lng`) VALUES ('$lokotitle', '$description', '$category', '$showyourname', '$yourname', '$lat', '$lng')";
    mysqli_query($link,$insqDbtb) or die(mysqli_error($link));

    ?><script>window.location.href = "../index.php"; </script> <?php
    exit;
  }
}
?>

This is a section of form.php that I am trying to display an error message in:

<form class="form-horizontal" role="form"  action="handleform/sendformdata.php" method="POST">
            <legend></legend>
            <div class="form-group">

                <label for="lokotitle" class="col-sm-2">Loko Title</label>
                <div class="col-sm-4">
                    <input type="text" class="form-control" name="lokotitle" id="lokotitle" placeholder="Title">
                    <span id="notitle"></span>
                </div>

Thanks in advance for the help!

I'd like to display the message on the form page without it redirecting. — pcris
– pcris, Commented Jul 31, 2016 at 7:25

bhansa · Accepted Answer · 2016-07-31 07:46:11Z

1

I recommend you to use both html5 required attribute which will force the user to enter the data. But remember the user can bypass front end validation (by means of inspect element), hence back end validation is also necessary.

Use required attribute like:

<input type="text" required />

You can try this

  if(empty($lokotitle)) {
    $error_message = "Please input a Loko title.";
     echo "<script>
             document.getElementById('#notitle').value='".$error_message."';".
           "</script>";
    exit;
  }

Let me know if this solves your problem

edited Jul 31, 2016 at 7:46

bhansa

7,5763 gold badges35 silver badges58 bronze badges

answered Jul 31, 2016 at 7:30

geeksal

5,0163 gold badges27 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

pcris Over a year ago

Using the required attribute works, but for some reason doing it manually with this php code isn't working.

Collectives™ on Stack Overflow

PHP form handling- display error message using javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related