phpsqlajaxsearchlivesearch

Ajax search results with on click result to download file

MY INDEX PAGE

    <html>
         <head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
          <title>Some name</title>
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
          <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
          <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
         </head>
         <body>
          <div class="container">
           <br />
           <h2 align="center">Search by name</h2><br />
           <div class="form-group">
            <div class="input-group">
             <span class="input-group-addon">Search</span>
             <input type="text" name="search_text" id="search_text" placeholder="Enter model / search here" class="form-control" />
            </div>
           </div>
           <br />
           <div id="result"></div>
          </div>
         </body>
        </html>

    <script>
    $(document).ready(function(){

     load_data();

     function load_data(query)
     {
      $.ajax({
   url:"fetch.php",
   method:"POST",
   data:{query:query},
   success:function(data)
   {
    $('#result').html(data);
   }
  });
 }
 $('#search_text').keyup(function(){
  var search = $(this).val();
  if(search != '')
  {
   load_data(search);
  }
  else
  {
   load_data();
  }
 });
});
</script>

AND MY fetch.php PAGE which is used to get data from the database tables and output results. I also added if the result is > 50 it will ask to enter few more characters because if I don't add if result > 50 then my page took 20sec to display all data because my database table has 25000 entries.

<?php

$connect = mysqli_connect("localhost", "root", "PASSWORD", "DATABASE");
if(isset($_POST["query"]))
{
 $search = mysqli_real_escape_string($connect, $_POST["query"]);
 $query = "
  SELECT * FROM files 
  WHERE Name LIKE '%".$search."%'
 ";
}
else
{
 $query = "
  SELECT * FROM files ORDER BY ID
 ";
}
$result = mysqli_query($connect, $query);

if(mysqli_num_rows($result) < 500)
{
 $output1 .= '
  <div class="table-responsive">
   <table class="table table bordered">
    <div>
     <th>Name</th>
     <th>URL</th>
     <th>Extension</th>
    <th>Download</th>
    </div>
 ';

 while($row = mysqli_fetch_array($result))
 {
  $output2 .= '
   <tr>
    <td>'.$row["Name"].'</td>
    <td>'.$row["URL"].'</td>
    <td>'.$row["Extension"].'</td>
   </tr>
  ';
 }
 if(mysqli_num_rows($result) > 0)
 {
    echo "$output1";
    echo "$output2";
 }
else
{
    echo 'no results found';
}
}
else
{
 echo 'Please enter few more charecters';
}

?>

I want href link for each of my results and on the click, it should download a file from ./"URL" column from a database table.

My database looks like this:

enter image description here

AND MY CURRENT PAGE IS http://mss1996.ddns.net:8008/files

I tried adding < a href=".$row["URL"]."> in outpur'array' but it destroys my page.

Solution

  • You should be able to easily add the URL field to form a valid URL if the contents of that field is indeed a valid URL. What I see missing form your code is http or https if it's an external link. If it's a relative link within the page then you're ok. Then add the </a> to close the link. So you'd form your table column like this:

    echo '<td><a href="' . $row['URL'] . '">' . $row["URL"] . '</a></td>';