2
我對所有這些技術（php，knockout和ajax）都很新穎。無法使用ajax調用服務器加載數據
我試圖加載從phpMyAdmin的DB數據但似乎沒有執行我的AJAX調用 。我的js中的loadData函數在HTML 中調用，它控制了我在UI中表的可見性。意思是， 表只有當我從服務器獲取數據時纔可見。
我的HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script type='text/javascript' src='knockout-2.2.0.js'></script>
</head>
<body>
<div class="container" data-bind="load: loadData()">
<table data-bind="visible: people().length > 0" class="students">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Remove</th>
<th>Update</th>
</tr>
</thead>
<tbody data-bind="foreach: people">
<tr>
<td>
<span data-bind="text: name"></span>
</td>
<td>
<span data-bind="text: age"></span>
</td>
</tr>
</tbody>
</table>
</div>
</body>
<script type='text/javascript' src='studentapp.js'></script>
</html>
JS
var personModel = function(id, name, age){
var self = this; //caching so that it can be accessed later in a different context
self.id = ko.observable(id); //unique id for the student (auto increment primary key from the database)
self.name = ko.observable(name); //name of the student
self.age = ko.observable(age);
};
var model = function() {
var self = this;
self.people = ko.observableArray([]);
self.loadData = function() {
//console.log("AHAHAHAH");
// alert("super");
//fetch existing student data from database$(document).ready(function() {
$.getJSON("refresher_save.php", function(data) {
for(var x in data){
//student details
var id = data[x]['id'];
var name = data[x]['name'];
var age = data[x]['age'];
//push each of the student record to the observable array for
//storing student data
self.people.push(new personModel(id, name, age));
}
});
};
};
ko.applyBindings(new model());
PHP
<?php
$db = new mysqli('localhost', 'root', '', 'student');
$action = (!empty($_POST['action'])) ? $_POST['action'] : ''; //action to be used(insert, delete, update, fetch)
$student = (!empty($_POST['student'])) ? $_POST['student'] : ''; //an array of the student details
//check if the student is not an empty string
//and assigns a value to $name and $age if its not empty
if(!empty($student)){
$name = $student['name'];
$age = $student['age'];
}
switch($action){
default:
//only select student records which aren't deleted
$students = $db->query("SELECT * FROM students WHERE status = 1");
$students_r = array();
while($row = $students->fetch_array()){
//default student data
$id = $row['id'];
$name = $row['name'];
$age = $row['age'];
//update status
//its false by default since
//this is only true if the user clicks
//on the span
$name_update = false;
$age_update = false;
//build the array that will store all the student records
$students_r[] = array(
'id' => $id, 'name' => $name, 'age' => $age
);
}
echo json_encode($students_r); //convert the array to JSON string
break;
}
?>
誰能幫助？
可能是你需要'JSON.parse（數據）'第一，然後通過'json'數據環 –
@AmitSoni沒有OP使用'數據類型： 'json'，' –
請注意，您正在執行GET請求，但期待POST數據？ – adeneo