populate data from database when tab key is pressed

Question

I am using jquery, ajax and php to retrieve data from database. I want to achieve a functionality i.e. When user inputs product code and press TAB Key the data should be filled in textarea. I'm new to ajax n php, I've checked my query in SQL it is working.. Please help me

html

<input type="text" class="form-control col-md-5 detectTab" name="product_code" />
<textarea class="form-control autogrow" id="container" name="desc" rows="3" cols="5" placeholder="Remarks" required></textarea>

Script

    <script type="text/javascript">
$(function(){
    $("#product_code").keydown(function(e){
if(9 == e.keyCode){
       var postlink = 'loaddesc.php';
            $.post(postlink).done(function(data){
                if(data)
                    $("#container").val(data);
                else
                    $("#container").val('No Data Received');
            }
        }
    })
})
</script>

loaddesc.php

<?php
include('config.php');
if($_POST['$product_code'] )
{
$product_code=$_POST['product_code'];
$sql=mysqli_query($con, 'SELECT concat(A.PRODUCT_CAT_NAME," - ", B.name," - ", C.PRODUCT_SERIAL_NO," - ",c.product_desc) Product_Details 
                        FROM dms_product_cat A, dms_product_type B, dms_products c WHERE A.product_cat_id = 1 AND B.product_cat_id = A.product_cat_id and B.type_id = c.product_type
and c.product_code = "$product_code"');
    while($row=mysqli_fetch_array($sql))
    {
    $data=$row['Product_Details'];
    echo $data;
    }
}
?>

score 0 · Answer 1 · edited May 23 '17 at 10:26

0

Your sql query can not works because variables in single quote strings are not evaluated. Anyway it s a bad idea to build your request like this. There is a sql injection vulnerability in it.

You should read this: How can I prevent SQL injection in PHP?

edited May 23 '17 at 10:26

Community

1
1

answered Sep 12 '15 at 09:04

Clem

2,150
15
17

score 0 · Answer 2 · answered Sep 12 '15 at 11:20

Logical Solution to your question

When user inputs product code and press TAB Key the data should be filled in textarea.

START
input box where user will fill data and will press tab
a javascript function call on pressing key
check whether the key is "tab"
jquery post method fire to server requesting data
fetched data in success
display the data in the required textarea
DONE

CODE SAMPLE

<html>
<head>
    <title>TEST AJAX</title>
</head>

<body>
    <!-- The input Box -->
    <input type="text" name="product_code" id="product_code" autofocus/>
    <!-- The Text Area -->
    <textarea id="container" name="desc" placeholder="Remarks"></textarea>
</body>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    // Will fire on any key press in input box
    $("#product_code").keydown(function(e){

        //alert(e.keyCode); // Remove the comment to check for keypress Code

        // KeyCode 9 is for TAB key
        if(9 == e.keyCode){
            // Sending via ajax to fetch data
            var postlink = ''; // Required Backend Script Handler
            $.post(postlink).done(function(data){
                // Handling the fetched data
                if(data)
                    $("#container").val(data); // Filling data in textarea
                else
                    $("#container").val('No Data Recieved'); // No data recieved
            }
        }
    })
})
</script>
</html>

I believe your issue is settled now.

Thanks & Regards

populate data from database when tab key is pressed

2 Answers2