無刷新提交表單（ajax，php）

Question

我正在嘗試提交表單而不刷新頁面，我希望在點擊按鈕id = fav時出現提醒消息。這是代碼，但我不知道我做錯了什麼。它應該是在按鈕點擊或表單提交？

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
    <script> 
$(document).ready(function(){ 
$("#f1").submit(function(){ 




// AJAX Code To Submit Form. 
$.ajax({ 
type: "POST", 
url: "bookpage.php", 
data: {'fav':'fav'} , 
cache: false, 
success: function(response){ 
if(response.message){ 
alert(response.message); 
} 
} 
}); 
} 
return false; 
}); 
}); 
    </script> 

<form action="#read" method="post" id="f1"> 
    <div class="r1"> 
    <button class="down" name="download" title="Add to favorites">Download</button> 
    <li><a class="full" href="full.php?id=<?php echo $id; ?>">Full page</a> 
    </li> 

    <button class="d-later" name="dlater">Download later</button> 
    <button class="fav-button" type="submit" id="fav"></button> 

    </div> 
</form> 

PHP

if(isset($_POST['fav']) && $_POST['fav'] == 'fav' && fav_exists($u , $ii)== true){ 

     $query = "DELETE FROM favorites WHERE bid='$ii' AND email='$u'"; 
     $result = mysql_query($query); 
     if(! $result) { 

      die('Could not delete data: ' . mysql_error()); 

    } $response['message'] = 'My message'; 
echo json_encode($response); 

    }else if(isset($_POST['fav']) && $_POST['fav'] == 'fav' && fav_exists($u , $ii)== false){ 


      $query = "INSERT INTO favorites (email,book, bid) VALUES('$u','$bname','$ii')"; 
     $result = mysql_query($query); 
     if(! $result) { 

      die('Could not enter data: ' . mysql_error()); 
    } 
    $response['message'] = 'My message'; 
echo json_encode($response); 
} 

    function fav_exists($u , $ii){ 


    $query = "SELECT id FROM favorites WHERE email='$u' AND bid='$ii'"; 
    $result = mysql_query($query); 
    $count = mysql_num_rows($result); 


    if($count >= 1) { 
     return true; 
    } else { 
     return false; 
    } 

} 

Answer 1

我想你逝去的空數據，參見下面的例子是如何通過一些數據;如果你想運行AJAX + PHP你需要傳遞一些數據

<?php if(isset($_POST['action'] && $_POST['action'] == 'my_action') { 
// do stuff; 
// to send json response use json_encode; 
$response['message'] = 'My message'; 
echo json_encode($response); 
} 


$.ajax({ 
url: "my_php.php", 
type: "POST", 
data: { 'action' : 'my_action' }, 
success: function(response){ 
if(response.message){ 
alert(response.message); 
} 
} 
}); 

此外，我強烈建議使用PHP PDO進行SQL查詢 - http://php.net/manual/en/book.pdo.php

UPD：

$('#fav').click(function(){ 
    do_ajax_request('you can pass different type of acitons as param'); 
}); 
function do_ajax_request(action) { 
$.ajax({ 
url: "my_php.php", 
type: "POST", 
data: { 'action' : action }, 
success: function(response){ 
    if(response.message){ 
    alert(response.message); 
    } 
} 
}); 
} 

而在你的php文件你可以switch或if/else不同的功能取決於你的action;

<?php if(isset($_POST['action'])) { 
    $action = $_POST['action']; 
    switch($action) { 
    case 'favorites': 
    $msg = 'favorites action called'; 
    breake; 
    case 'not fav': 
    $msg = 'not fav called'; 
    breake; 
    default: 
    $msg = 'Nothing passed'; 
    breake; 
    } 
    $Response['msg'] = $msg; 
    echo json_encode($Response); 
} 

Answer 2

這就是我用於同樣的任務。

HTML

<form action="" method="post"> 
name:<input type="text" name="user" /> <br/> 
<p><input type="submit" /></p> 
</form> 

JS

$(function() { 
    $('form').submit(function(e) { 
     e.preventDefault(); // Stop normal submission 
     data = $('form').serializeArray(); 
     alert(JSON.stringify(data)); 
     $.ajax({ 
      type: 'POST', 
      contentType: "application/json; charset=utf-8", 
      url: 'inc/update.php', 
      data: { 
       json: JSON.stringify(data) 
      }, 
      dataType: 'json' 
      } 
     }); 
    }); 
    return false; 
}); 

PHP

$str_json = file_get_contents('php://input'); 
$str_json = urldecode($str_json); 
$str_json = str_replace('json=[', '', $str_json); 
$str_json = str_replace(']', '', $str_json); 
$arr_json = json_decode($str_json, true); 
$name = $arr_json['name']; 

$pdo = new PDO("mysql:host=$db_host;dbname=$db_name", $db_user, $db_password); 
$update = $pdo->prepare("UPDATE user SET name='".$name."' WHERE id='3';"); 
$update->execute();