I’m trying to retrieve information from my database, and output it to my page. I’m able to hardcore it, so to show exactly what I want to be able to do is located here:
I’m not having any console errors in the javascript, but I am unable to append data to the list once it is clicked.
HTML & JS:
<!doctype html><html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="../img/sd.ico" />
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="body">
<div id="header"><h1><a href="#">Bookmarks</a></h1></div><!-- header -->
<iframe id="iFrame" name="iFrame"></iframe>
<div id="links"><ul id="accordion">
<li><div class="bookmarkTitle"><p><h4>CareerResources</h4></p></div></li><ul id="CareerResources">
</ul><li><div class="bookmarkTitle"><p><h4>CSS</h4></p></div></li><ul id="CSS">
</ul><li><div class="bookmarkTitle"><p><h4>JS</h4></p></div></li><ul id="JS">
</ul><li><div class="bookmarkTitle"><p><h4>JS: Jquery</h4></p></div></li><ul id="JS: jQuery">
</ul></div><!-- links end -->
</div><!-- body end -->
<script type="text/javascript">
$(document).ready(function(){
$("#accordion > li").click(function(e){
var catName=$(e.target).text();
$.getJSON("get.php?catName=" + catName, function(data){
if (data.data){
$.each(data.data,function(index,value){
var url = value.URL;
var title = value.title;
var desc = value.desc;
alert(catName);
$("#"+catName).append('<a href="'+url+'" target="iFrame"><div class="bookmark"><p><h3>'+title+'</h3><br />'+desc+'</p></div></a>');
});
}
});
});
});
</script>
</body>
</html>
PHP:
// retval: 0 - login ok, 1 - login failed, 2 - internal error
$json = array("retval" => 2, "data" => NULL, "debug" => "");
$catName=mysql_real_escape_string($_REQUEST['catName']);
$sql="SELECT * FROM linktb WHERE catName='$catName'";
$json['debug'] .= "SQL query was: ".$sql."\n";
$result=mysql_query($sql);
if (!$result) {
$json['debug'] .= "SQL query failed\n";
$json['debug'] .= "Other output: ". ob_get_contents();
ob_end_clean();
die(json_encode($json));
}
$count=mysql_num_rows($result);
if($count > 0){
$json['retval'] = 0;
$json['data'] = array();
while ($row = mysql_fetch_assoc($result)){
$json['data'][] = $row;
}
} else {
$json['retval'] = 1;
}
$json['debug'] .= "Other output: ". ob_get_contents();
ob_end_clean();
echo json_encode($json);
var catID=e.target.text();Should bevar catID=$(e.target).text();as.text()is a jQuery method.If you want to iterate through the returned data you’ll have to do it in the success function. Also from your php script you only output one row from your database.