I have already completed the live search part. I want to put the value of the search result into a textbox in a different php file.
AJAX Code: [In index.php]
<script>
function search(string){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("search_div").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "search.php?s="+string, true);
xmlhttp.send(null);
}
</script>
html text type: [In index.php]
<div class="input-field col s12">
<i class="material-icons prefix">account_circle</i>
<input id="name" type="text" name="name" class="validate" onkeyup="search(this.value)">
<label for="name">Doctor's Name</label>
<div id="search_div">
</div>
Data Retrieve from Database: [in search.php]
<?php
ob_start();
require 'config.php';
$conn = new mysqli("localhost","root","","dcare");
if($conn->connect_errno)
{
die('Sorry! Connection was not Successful');
}
if(isset($_GET['s']) && $_GET['s'] != ''){
$s = $_GET['s'];
$sql = "SELECT * FROM doctor WHERE name LIKE '%$s%'";
$result = $conn->query($sql) or die($conn->error);
while($row = $result->fetch_assoc()){
$name = $row['name'];
$designation = $row['designation'];
echo "<div style='' id='searchtitle'>" . "<a style='font-family: verdana; text-decoration: none; color: black; href='$name'>" . $name . "</a>" . "</div>";
}
}
?>
Now I want to Click on the Tania Rahman and The value will be saved to the value of "name" textbox in the index.php file.
So based upon what you have said, all you need is some simple javascript. However to make it a bit tidier, I have modified your script below.
AJAX Code in index.php, just added an additional function.
<script>
function search(string){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("search_div").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "search.php?s="+string, true);
xmlhttp.send(null);
}
function setName(string) {
document.getElementById("name").value = string;
}
</script>
HTML Code in index.php (not updated)
<div class="input-field col s12">
<i class="material-icons prefix">account_circle</i>
<input id="name" type="text" name="name" class="validate" onkeyup="search(this.value)">
<label for="name">Doctor's Name</label>
<div id="search_div">
</div>
Search.php
<?php
ob_start();
require 'config.php';
$conn = new mysqli("localhost","root","","dcare");
if($conn->connect_errno)
{
die('Sorry! Connection was not Successful');
}
if(isset($_GET['s']) && $_GET['s'] != ''){
$s = $_GET['s'];
$sql = "SELECT * FROM doctor WHERE name LIKE '%$s%'";
$result = $conn->query($sql) or die($conn->error);
while($row = $result->fetch_assoc()){
$name = $row['name'];
$designation = $row['designation'];
// No need for a href in the anchor tag, as you don't want it to redirect to any page, but added a style for a pointer cursor
echo "<div id='searchtitle'>" . "<a style='font-family: verdana; text-decoration: none; color: black; cursor: pointer;' onclick='setName(\"$name\")'>" . $name . "</a>" . "</div>";
}
}
?>
I haven't tested it - but it should work provided your script was already working.
A couple of notes:
<a style="">
), as whilst it is a quick and easy solution it makes it harder to maintain your code. Define a style class that has the same attributes. One of the purposes of CSS is to seperate styling from semantics.Hope this helps.