数据库数据永远不会显示在html中
我试图从数据库中收集类别数据并在html中的类别下拉列表中显示。但是,它不会工作。我不知道哪个部分出了问题。输出返回null,它从不收集数据库类别表中的任何数据。数据库数据永远不会显示在html中
这是我的html文件
<!DOCTYPE html>
<html>
<style>
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
</style>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/ionic.min.css" />
<title>Create an Account</title>
</head>
<body onload="selectCategory()">
<div class="bar bar-header">
<a href="index.html" class="button button-clear button-royal">Back</a>
<h1 class="title">Add an Item</h1>
</div>
<div class="padding" style="margin-top:75px;">
<label class="item-input">
<span class="input-label">Item Name</span>
<input type="text" placeholder="" id="itemName">
</label>
<label class="item-input">
<span class="input-label">Category</span>
<select id="select_category">
<option value="0">- Select -</option>
</select>
</label>
<label class="item-input">
<button class="button button-block button-positive" id="signup">Add item</button>
</label>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jq.js"></script>
<script type="text/javascript" src="js/addProduct.js"></script>
</body>
</html>
addProduct.js
function selectCategory() {
$.ajax({
url: 'http://selectCategory.php?callback=?',
type: 'post',
data: "",
dataType: 'json',
success:function(response){
var len = response.length;
$("#select_category").empty();
for(var i = 0; i<len; i++){
var id = response[i]['id'];
var name = response[i]['name'];
$("#select_category").append("<option value='"+id+"'>"+name+"</option>");
}
}
});
}
selectCategory.php
<?php
header("Access-Control-Allow-Origin: *");
$host = 'localhost';
$username = 'username';
$password = 'password';
$database = 'database';
$pdo = new PDO("mysql:host=$host;dbname=$database", $username, $password);
$stmt = $pdo->query("SELECT * FROM category");
$users_arr = array();
while ($row = $stmt->fetch()) {
$users_arr[] = array("id" => $row['id'], "name" => $row['name']);
}
// encoding array to json format
echo json_encode($users_arr);
?>
您正在使用mysql_connect
和mysql_select_db
这是已弃用的功能。使用PDO访问您的数据库:
<?php
header("Access-Control-Allow-Origin: *");
$host = 'localhost';
$username = 'username';
$password = 'password';
$database = 'database';
$pdo = new PDO("mysql:host=$host;dbname=$database", $username, $password);
$stmt = $pdo->query("SELECT * FROM category");
$users_arr = array();
while ($row = $stmt->fetch()) {
$users_arr[] = array("id" => $row['id'], "name" => $row['name']);
}
// encoding array to json format
echo json_encode($users_arr);
?>
使用此代码,selectCategory.php已经向我返回了正确的数据,但它仍然不会显示在HTML文件中 –
有两件事:在
标记中,您的身体有两次。在您的$ .ajax中,将类型更改为'get' – mulquin我已经删除了该主体。我改变类型也得到,但它也不会显示 –
在selectCategory.php文件,你有以下部分:
$.ajax({
url: 'http://selectCategory.php?callback=?',
你在你的请求,这应该是一个不同的域的呼叫,而你的情况是不是也该回调参数实际上心不是做任何事情有HTTP,尝试改变它像这样:
$.ajax({
url: '/selectCategory.php',
其实这是一个phonegap项目,PHP文件是存储在线服务器,这是不同的位置与HTML文件 –
然后,你必须把你的在线服务器的位置ajax调用 – NickyP
是的,我做了,我也删除了回调参数,但是当我直接去selectCategory.php的位置,它返回我null –
在addProduct.js中,从http://selectCategory.php中删除http:// callback =? – mulquin
其实这是一个phonegap项目,php文件是存储在线服务器,这是与html文件不同的位置 –
好吧,添加域名或IP地址之前selectCategory.php – mulquin