javascriptphpjquery.post

$.post variables not passing to php getting undefined index error


This code almost works, it inserts into the db and it is giving feedback on the page to say it has updated. However I am getting undefined index between lines 5-8 in the insert_message.php and my database is filling with blank entries (except the date).

Apologies for being new to jquery and AJAX. Need some help.

form

<form enctype='multipart/form-data' action='insert_message.php' method='POST' id='contact_form'>

                    <div class="row">
                        <div class="col-xs-6">
                            <div class='form-group'>
                                <label for='email'>Email:</label>
                                <input class='form-control' type='email' id='email' name='email' required='required' maxlength='35'/>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-xs-6">
                            <div class='form-group'>
                                <label for='subject'>Subject:</label>
                                <input class='form-control' type='text' id='subject' name='subject' required='required' maxlength='35'/>
                            </div>
                        </div>
                    </div>



                    <div class="form-group">
                        <label for='message'>Message:</label>
                        <textarea class="form-control" placeholder="Message" id='message' required="required"></textarea>
                    </div>

                    <input type="hidden" name="reciever" id='receiver' value="Admin">
                    <input class='btn btn-primary' id='submit' type='submit' value='submit' >
                </form>
                <span id="result"></span>

jquery

<script>
        $(document).ready(function(){

    $("#submit").click( function(e) {
        e.preventDefault();
        var message1 = $('message').val();
       var sender1 = $('sender').val();
       var receiver1 = $('receiver').val();
       var subject1 = $('subject').val();

 $.post("insert_message.php", {message:message1, sender:sender1, receiver:receiver1, subject:subject1}, function(info) { $("#result").html(info);
   });

clearInput();
});

$("#contact_form").submit( function() {
  return false;
});
function clearInput() {
    $("#contact_form :input").each( function() {
       $(this).val('');
    });
}
});
        </script> 

insert_message.php

    <?php
include("connections/conn.php");

$getsubject = mysqli_escape_string($conn,$_POST["subject1"]);
$getmessage = mysqli_escape_string($conn,$_POST["message1"]);
$getsender = mysqli_escape_string($conn,$_POST["sender1"]);
$getreceiver = mysqli_escape_string($conn,$_POST["receiver1"]);
$date = date("Y-m-d");

$insertmessage = "INSERT INTO messages (id,subject,message,date,sender,receiver) VALUES (NULL,'$getsubject','$getmessage','$date','$getsender','$getreceiver')";
$insert = mysqli_query($conn, $insertmessage) ;
   if($insert){
               echo "Message Sent";
   }else{
       echo "Message did not send";
   }

UPDATE

attempted alternative way but I still get the undefined index in the inser_message.php

$(document).ready(function(){
 $("#submit").click( function(e) {
        e.preventDefault();

        $.ajax({
           url: "insert_message.php", 
           type: "POST",
           data: $("#contact_form").serialize(),
           success: function(result){
               $("#result").html(result);
           }
        });

    });

});

Solution

  • You have several problems in both JS and PHP.

    1. Adjust typo in input hidden where actually name="reciever" instead of name="receiver";
    2. In your $("#submit").click() function you're trying to selecting elements with an invalid selector (e.g. $('message').val() instead of $("#message").val());
    3. Adjust $_POST keys by removing 1 at end. If you have any doubt, print the whole array print_r($_POST);
    4. This is not an error but a suggestion. Since you require conn.php to do your job, I would use require instead of include.