varHelloHi
varHelloHi

Reputation: 23

error while Live Search using Ajax

Unable to get the results from database..! This is my Index.html

<html>
<head>
    <title>Live Search</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript">
        function findName(str)
        {
            $.POST("names.php",{partialName:str},function(data));
            $("#result").innerHtml=data;
        }
    </script>
</head>

<body>
    <center>
        Enter The Name: <input type="text" onkeypress="findName(this.value)">
        <br>
        <div id="result">

        </div>
    </center>
</body> 

This is names.php

<?php
mysql_connect("localhost","root","");
mysql_select_db("test");

$name=$_POST['partialName'];
$result=mysql_query("SELECT fname FROM name where fname LIKE '%$name';")or die(mysql_error());

while($list=mysql_fetch_array($result))
{
    echo "<div>".$result['fname']."</div>";
}

?>

And the error i am getiing while inspecting the element is: Uncaught ReferenceError: findName is not definedonkeypress @ (index):16

Upvotes: 0

Views: 41

Answers (3)

Pinguto
Pinguto

Reputation: 436

So it should work ..

function findName(str){
      $.post("names.php",{partialName:str},function(data){
        $("#result").html(data);
    });
  }

Upvotes: 0

Jay Momaya
Jay Momaya

Reputation: 2049

Edit Your Function:

<script type="text/javascript">
function findName(str)
{
    $.ajax({
        type: "POST",
        url: "names.php",
        data: {
        partialName: str
    },
    success: function(data){
            $("#result").innerHtml=data;
        }
    });
}

Upvotes: 0

OldPadawan
OldPadawan

Reputation: 1251

this line $.POST("names.php",{partialName:str},function(data)); will throw an error (check console)

SyntaxError: expected expression, got ')'

ReferenceError: findName is not defined

check jQuery POST to see it

Here's a quick fix (added name to input too):

<script type="text/javascript">
    function findName(str)
    {
        $.ajax({
        type: "POST",
        url: "names.php",
        data: {
        partialName: str
        },
        success: function(data){
        $("#result").html(data);
        }
        });
    }
</script>

HTML:

<input type="text" name="str" onkeypress="findName(this.value)" />

Upvotes: 1

Related Questions