Reputation: 2459
I am trying to enable user select movies by title or by Actors (e.g in case that he forgot the movie name but remembered an actor/actress in that movie, he would be able to find movie by typing the actor name). I used jQuery auto-comlete to get movie names or actor names.
Below is what I have tried. The auto-complete parts works fine (i.e, when user choose moviebyTitle and start writing the title, the autocomplete suggestion works, also for actor names.
When user write the actor name, autocomplete works fine, Also a dynamic dropdown menu will be appeared, but the problem is that this dropdown displays nothing :| Could someone kindly help me find what is the problem with this code? Thanks,
<select id="selectType" name="source">
<option value="">MoviesBy</option>
<option value="byTitle">byTitle</option>
<option value="byActor">byActor</option>
</select>
<input type="textbox" name= "tag" id="tags">
<select id="movieImdbId" name="movieImdbId[]" multiple="multiple" width="200px" size="10px" style="display: none;">
</select>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
//Create widget with default data source
$("#tags").autocomplete({
source: "actorsauto.php",
minLength: 2
});
$("#selectType").change(function () {
// Assign new data source like that :
if ($(this).val() == "byTitle")
$("#tags").autocomplete("option", "source", "filmsauto.php");
else
if ($(this).val() == "byActor"){
$("#tags").autocomplete({
source: "actorsauto.php",
minLength: 2,
select: function (event, ui){
var selectedVal = $(this).val(); //this will be your selected value from autocom plete
// Here goes the ajax call.
$('#movieImdbId').show();
$.post("actions.php", {q: selectedVal, q2: $("#selectType").val()}, function (response){
// response variable above will contain the option tags. Simply put in the dropdown.
$("#movieImdbId").html(response);
});
}
});
}
});
});
</script>
and here is the actions.php:
<?php
if(isset($_GET['q']) && !empty($_GET['q']) && isset($_GET['q2']) && !empty($_GET['q2']) ){
$q = $_GET['q'];
$q2 = $_GET['q2'];
include('imdbConnection.php');
$sql = $conn->prepare("SELECT DISTINCT movieImdbId FROM movie_roleNames WHERE castName = :q");
$sql->execute(array(':q' => $q));
// Initialize a variable that you will send back to your ajax call, its still waiting for this script to be completed.
$html = "";
$results = $sql->fetchAll(PDO::FETCH_OBJ);
while($results as $row){
$option = '<option value="' . $row['movieImdbId'] . '">' . $row['movieImdbId'] . '</option>';
$html .= $option;
}
echo $html;
exit;
}
?>
This is what I see:
Upvotes: 0
Views: 111
Reputation: 8819
You are mixing mysql
and PDO
so try to use PDO
instead of mysql
.
You also need to add value in $html
variable instead of overwrite value again and again.
change lower part of code like this because you are
$results = $sql->fetchAll(PDO::FETCH_OBJ);
while($results as $row){
$option = '<option value="' . $row->movieImdbId . '">' . $row->movieImdbId . '</option>';
$html.= $option;
}
echo $html;
exit;
Upvotes: 1