Jquery ajax Postが動作していませんか？

Question

私はフォームなしでajax投稿を使用しました。送信ボタンをクリックすると、他のフィールドの値を取得するはずです。投稿要求が送信されておらず、どちらの出力も表示されていません。これは、ここで入力フィールド

<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"> 

これはAjaxのリクエストで、このエラーUnexpected identifier

をされて戻っています。

$(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); 

    }); 

それは私がなぜこれが機能していないことを知ってほしい、このPHPページへ

<?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 
} 
?> 

をリクエストを送信しています。

Answer 1

あなたのJSONデータが無効であると鳴ります。

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

Answer 2

簡単なクリック機能を使用して、あなたが送信ボタンをクリックした場合は、データを表示したい

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.net/cod7ceho/116/

Answer 3

このコードを試してみてください。 setIntervalを使用すると、submitをクリックするのに役立つことはありません。 。

$(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); 
       } 
      }); 

     }); 
     });