I have used ajax post without form. When I click submit button it should get the values of other fields. Post request is not being sent and neither output is being shown. It is returning this error Unexpected identifier

Here are the input fields

<input type="text" name="name" id="name" class="center-block Ename" placeholder="Enter you name">
            <textarea class="center-block" name="message" id="message" rows="1" placeholder="Enter your message"></textarea>
            <input class="center-block sendBtn" type="submit" id="submit" name="submit" value="Submit">

This is the ajax request.

$(document).ready(function(){
        var interval = setInterval($('#submit').click(function(){
            var values = {
                'name': document.getElementById('name').value,
                'message': document.getElementById('message').value
            };
            $.ajax({
                type: "POST",
                url: "chat.php",
                data: values,
                success: function(data){
                    $("#chat").html(data);
                }
            });

        }),1000);

    });

It is sending request to this php page

<?php
include 'db.php';


//Here post data is being assigned to variables
        $name = $_POST['name'];
        $message = $_POST['message'];
        $queryInsert = "INSERT INTO chat(`name`, `message`) VALUES('$name', '$message')";
        $queryInsertRun = mysqli_query($con, $queryInsert);
        if(!$queryInsertRun){
            echo mysqli_error($con);
        }



//Here is the output which should be shown

$query = "SELECT * FROM `chat` ORDER BY `name` AND `message` DESC ";
$queryRun = mysqli_query($con, $query);
while($row = mysqli_fetch_assoc($queryRun)){
$name = $row['name'];
$message = $row['message'];
?>
    <span class="name" style="font-weight: bold"><?php echo  $name?>:</span>
    <span class="message"><?php echo  $message.'<br>'?></span>
    <hr>
<?php
}
?>

I want to know that why is this not working.

I have used ajax post without form. When I click submit button it should get the values of other fields. Post request is not being sent and neither output is being shown. It is returning this error Unexpected identifier

Here are the input fields

<input type="text" name="name" id="name" class="center-block Ename" placeholder="Enter you name">
            <textarea class="center-block" name="message" id="message" rows="1" placeholder="Enter your message"></textarea>
            <input class="center-block sendBtn" type="submit" id="submit" name="submit" value="Submit">

This is the ajax request.

$(document).ready(function(){
        var interval = setInterval($('#submit').click(function(){
            var values = {
                'name': document.getElementById('name').value,
                'message': document.getElementById('message').value
            };
            $.ajax({
                type: "POST",
                url: "chat.php",
                data: values,
                success: function(data){
                    $("#chat").html(data);
                }
            });

        }),1000);

    });

It is sending request to this php page

<?php
include 'db.php';


//Here post data is being assigned to variables
        $name = $_POST['name'];
        $message = $_POST['message'];
        $queryInsert = "INSERT INTO chat(`name`, `message`) VALUES('$name', '$message')";
        $queryInsertRun = mysqli_query($con, $queryInsert);
        if(!$queryInsertRun){
            echo mysqli_error($con);
        }



//Here is the output which should be shown

$query = "SELECT * FROM `chat` ORDER BY `name` AND `message` DESC ";
$queryRun = mysqli_query($con, $query);
while($row = mysqli_fetch_assoc($queryRun)){
$name = $row['name'];
$message = $row['message'];
?>
    <span class="name" style="font-weight: bold"><?php echo  $name?>:</span>
    <span class="message"><?php echo  $message.'<br>'?></span>
    <hr>
<?php
}
?>

I want to know that why is this not working.

• javascript
• php
• jquery
• ajax

• I think the problem is about returned data, can you ment this line $("#chat").html(data); and tell if you still get the error or not? – Mehdi Dehghani Commented Aug 30, 2016 at 14:48
• Is the problem at client-side or server side? Is there any error message? Please add more information. – Daniel Cheung Commented Aug 30, 2016 at 14:56

3 Answers 3

try this code

function ajaxcall()
{
console.log('i am called');
        var values = {
            'name': document.getElementById('name').value,
            'message': document.getElementById('message').value
        };

             $.ajax({
                type: "POST",
                url: "chat.php",
                data: values,
                success: function(data){
                    $("#chat").html(data);
                }
            });

}

$(document).ready(function(){
var id = setInterval(function() {
   ajaxcall();
}, 1000);
    });

http://jsfiddle/cod7ceho/116/

You want to display data if you clicked submit button , use simple click function . Using setInterval can't help you for clicking submit . JS

$(document).ready(function(){
        $('#submit').click(function(){
            var values = {
                'name': document.getElementById('name').value,
                'message': document.getElementById('message').value
            };
            $.ajax({
                type: "POST",
                url: "chat.php",
                data: values,
                success: function(data){
                    $("#chat").html(data);
                }
            });

        });
      });

It sounds like your JSON Data is not valid.

var data = JSON.stringify(values);
var request = $.ajax({
  url: "script.php",
  method: "POST",
  data: data,
  dataType: "html" // read about dataType
});