Tuesday, July 2

PHP Search Engine using Ajax,Jquery Technologies


Hi All,

Here I write a simple project for Search Engine using PHP, Ajax, Jquery and MySql.


1. This is a very simple search engine to search the records in single tables within the database. If you want you can add more tables according to your request.


2. The Search Engine shows tables values in the table format by clicking the Search button.


 Requirements details:


    Go to Site: http://jquery.com/download/

    And select then download the "Download the uncompressed, development jQuery 1.10.1" .

    Place it inside in your project JS folder. 


 Steps details:


Database details:


 1. create new database in MySQL.


2. in side the database create new table.


Example Db Structure:

/* Create DB Code*/

DROP DATABASE IF EXISTS `balabms`;

CREATE DATABASE IF NOT EXISTS `balabms` ;

USE `balabms`;

/*Create Table Code*/

DROP TABLE IF EXISTS `bmsbook`;

CREATE TABLE IF NOT EXISTS `bmsbook` (

  `bid` int(11) NOT NULL,

  `bname` varchar(32) NOT NULL,

  `auth` varchar(32) NOT NULL,

  `pub` varchar(32) NOT NULL,

  `cat` varchar(32) NOT NULL,

  `qty` int(11) NOT NULL,

  `price` double NOT NULL,

  KEY `bid` (`bid`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1;

/* Insert value to the Table*/

INSERT INTO `bmsbook` (`bid`, `bname`, `auth`, `pub`, `cat`, `qty`, `price`) VALUES

    (0, 'Programming in c', 'Dennis Rechie', 'At&t', 'Computers', 60, 499),

   (1, 'java', 'bala', 'Skitech', '3', 50, 150),

   (2, 'C++', 'SRI', 'Skitech', '26', 15, 120),

   (3, 'PHP', 'RAJA', 'Skitech', '30', 20, 220),

   (4, 'AJAX', 'KRISH', 'Skitech', '11', 30, 450),

   (5, 'JQUERY', 'ROCK', 'Skitech', '15', 45, 650);

Index.PHP
~~~~~~~~~~


<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <script src="js/jquery-1.10.1.js"></script>
       
        <!-- Ajax and Jquery Call for Search -->
       
        <script type="text/javascript">
            $(document).ready(function() {

                function search() {

                    var title = $("#search").val();

                    if (title != "") {

                        $.ajax({
                            type: "get",
                            url: "search.php",   <!-- Redirect Function  -->
                            data: "title=" + title,
                            success: function(data) {
                                $("#result").html(data);
                                $("#search").val("");
                            }
                        });
                    }
                }

                $("#button").click(function() {
                    search();
                });

                $('#search').keyup(function(e) {
                    if (e.keyCode == 13) {
                        search();
                    }
                });
            });
        </script> 
       
<!-- Internal style sheet for Search textbox and button -->

        <style type="text/css">
            #container{
                width:800px;
                margin:0 auto;
            }

            #search{
                width:350px;
                padding:10px;
            }

            #button{
                display: block;
                width: 100px;
                height:30px;
                border:solid #366FEB 1px;
                background: #d4e3e5;
            }

            ul{
                margin-left:-40px;
            }

            ul li{
                list-style-type: none;
                border-bottom: dotted 1px black;
                height: 50px;
            }

            li:hover{
                background: #A592E8;
            }

            a{
                text-decoration: none;
                font-size: 18px;
            }
        </style>
    </head>

    <!-- Define Search textbox and button -->


    <body>
        <div id="container">
            <input type="text" id="search" placeholder="Search Books name Here..."/>
            <input type="button" id="button" value="Search" />
           
        <!-- Result place -->   
       
            <ul id="result"></ul>
        </div>
    </body>
</html>

Search.php

~~~~~~~~~~~


<!-- Style sheet for fancy Table Format -->

 <style type="text/css">
table.hovertable {
    font-family: verdana,arial,sans-serif;
    font-size:11px;
    color:#333333;
    border-width: 1px;
    border-color: #999999;
    border-collapse: collapse;
}
table.hovertable th {
    background-color:#c3dde0;
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #a9c6c9;
}
table.hovertable tr {
    background-color:#d4e3e5;
}
table.hovertable td {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #a9c6c9;
}
</style>

<?php

/* Database Connection Method*/

  mysql_connect("localhost","root","") or die("Unable to connect Database");
  mysql_select_db("balabms") or die("error in Database name");

/*Fetching Search result Query*/

$result = "select * from bmsbook where bname like '%".$_GET['title']."%' or auth like '%".$_GET['title']."%' or
                bid like '%".$_GET['title']."%' or pub like '%".$_GET['title']."%' or cat like '%".$_GET['title']."%'";
    $res = mysql_query($result);
    $rec_count = mysql_num_rows($res);      

/*Checking the query contains value or Not */
    
if($rec_count>0){
    ?>
<table class="hovertable">
<tr>
    <th>Book ID</th>
    <th>Book Name</th>
    <th>Author</th>
    <th>Publisher</th>
    <th>Catagory</th>  
</tr>

<!-- IF contanis  records (Result) It will Display in fancy Table Format -->

<?php while ($row =mysql_fetch_row($res)){ ?>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
    <td><?php echo $row[0]; ?></td>
        <td><?php echo $row[1]; ?></td>
        <td><?php echo $row[2]; ?></td>
        <td><?php echo $row[3]; ?></td>
        <td><?php echo $row[4]; ?></td>
</tr>
        <?php } } else{ ?>

<!-- IF contanis not records (No Result) It will Display in fancy Table Format -->

       
</table>
        <table class="hovertable">
  <tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
    <td style="padding: 8px 140px;"><?php echo "No Records Found"; ?></td>
    
</tr>
        <?php }?>
</table>

 

OUTPUT

~~~~~~~~~


Result found:
 


Result not found:




  

No comments:

Post a Comment

Backup files to google drive using PHP coding

 Dear All, To backup files to Google Drive using PHP coding, you can use the Google Drive API and the Google Client Library for PHP. Here...