Skip to main content

autosearch in html css javascript and php

 Here the first page index.php 


<!DOCTYPE html>
<html>
<head>
    <title>Autocomplete Select Option from MySQL Database</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h2>Autocomplete Select Option from MySQL Database</h2>
    <form>
        <label for="autocomplete">Search:</label>
        <div style="display: flex; flex-direction:column">
        <input type="text" id="autocomplete" name="autocomplete">
        <select id="selectOption" style="display:none;" size="15" style="width:fit-content"></select>
        </div>
    </form>

    <script>
        $(document).ready(function(){
            $('#autocomplete').on('input', function(){
                var inputVal = $(this).val();
                $.ajax({
                    type: "POST",
                    url: "material.php",
                    data: {term: inputVal},
                    success: function(data){
                        $('#selectOption').html(data).show();
                    }
                });
            });

            $('#selectOption').on('change', function(){
                $('#autocomplete').val($(this).val());
                $(this).hide();
            });
        });
    </script>
</body>
</html>


here the second page for the finding the item in php

<?php
include("connect.php");

// Get input value
$term = $_POST['term'];

// Query database
$sql = "SELECT * FROM materialent WHERE matedesc LIKE '%$term%'";
$result = $store->query($sql);

// Generate options
$options = '';
if ($result->num_rows > 0) {
    while ($row = $result->fetch_assoc()) {
        $options .= '<option value="' . $row['matedesc'] . '">' . $row['matedesc'] . '</option>';
    }
}

// Return options
echo $options;

$store->close();
?>


so finally get the access of PHP data

Comments

Post a Comment

Popular posts from this blog

Creating designed pages in tkinter

Here in this blog we can make the creative pages in tkinter for the entry section   So here are the following codes for that:- from tkinter import * user_form = Tk () user_form . geometry ( "750x450" ) user_form . title ( "Register form" ) user_form . resizable ( 0 , 0 ) pic1 = PhotoImage ( file = "user_form.png" ) user_form1 = Label ( user_form , image = pic1 , width = 750 , height = 450 ) user_form1 .image= pic1 user_form1 . pack () name_en = Entry ( user_form , width = 14 , relief = "flat" , font =( "times" , 20 )) name_en . place ( relx = 0.385 , rely = 0.265 ) user_en = Entry ( user_form , width = 19 , relief = "flat" , font =( "times" , 20 )) user_en . place ( relx = 0.385 , rely = 0.365 ) psswd_en = Entry ( user_form , width = 18 , relief = "flat" , font =( "times" , 20 )) psswd_en . place ( relx = 0.385 , rely = 0.485 ) pic3 = PhotoImage ( file = "register.png" ) but1 = Button...
Post a Comment
Read more

entry box with the automatic listbox

 Here in this coding we are going to show the entry connected with the listbox in python. so here is the following coding as respective to the needs. ========================================================================= import tkinter as tk def on_change (* args ):     # print(args)     value = var_text . get ()     value = value . strip (). lower ()     # get data from test_list     if value == '' :         data = test_list     else :         data = []         for item in test_list :             if value in item . lower ():                 data . append ( item )                 # update data in listbox     listbox_update ( data ) def listbox_update ( data ):     # delete previous data     listbox . delete...
Post a Comment
Read more

How to make form in HTML?

  Here in this blog, we are providing the programming codes for making an HTML form. so here are the following codes:- <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > forms </ title > </ head > < body >     < h2 > this is form tutorial </ h2 >     < form action = "backend.php" >         <!-- yaha par bas input type karo aur ek list dikhayga aur jo daalna           hai select kar lo -->       <!-- here label works that if label for="name" and id ="name" than if we           will click on name on html web page than the cursor will go on the  ...
Post a Comment
Read more