Uncaught TypeError: autocomplete is not a function in jQuery

2017-06-17 18:59 Cicedea Andrei imported from Stackoverflow

I'm struggling to work with jQuery autocomplete to fill a HTML input from database. I wrote the whole code, but I still get this error

Uncaught TypeError: autocomplete is not a function in jQuery

and I can't understand why.

Here is my code:

gethint.php

<?php
    require_once ('connect.php');

    $q=$_REQUEST["q"]; 
    $sql="SELECT nume FROM angajati WHERE nume LIKE '%$q%'";
    $result = mysql_query($sql);

    $json=array();

    while($row = mysql_fetch_array($result)) {
      array_push($json, $row['nume']);
    }

    echo json_encode($json);
?>

profile_admin.php:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Forms</title>

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/datepicker3.css" rel="stylesheet">
<link href="css/profile.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->

</head>

<?php  
    require('connect.php');
    //3. If the form is submitted or not.
    //3.1 If the form is submitted

    $username = "";

    date_default_timezone_set('Europe/Bucharest');

    // setting the current date and time
    $date = date('Y-m-d H:i:s');

    if (isset($_GET['user'])){
    //3.1.1 Assigning posted values to variables.
        $username = $_GET['user'];
    }
    else{

        die("Nu esti logat");

    }

    $query = "SELECT * FROM angajati INNER JOIN conturi on conturi.id = angajati.id_cont INNER JOIN incadrare on angajati.id_incadrare=incadrare.id WHERE username='$username'";

    $result = mysqli_query($connection, $query) or die(mysqli_error($connection));

    if (mysqli_num_rows($result) > 0) {
        // output data of each row
        while($row = mysqli_fetch_assoc($result)) {
            $id = $row["id"];
            $name = $row["nume"];
            $prenume = $row["prenume"];
            $departament = $row["departament"];
            $data_angajarii = $row["data_angajarii"];
            $data_nasterii = $row["data_nasterii"];
            $telefon = $row["telefon"];
            $email = $row["email"];
            $adresa = $row["adresa"];
            $poza = $row["poza"];
            $titlu = $row["titlu"];
        }
    }
    else{
        die("Nu esti logat");
    }


?>

<body>

    <div class="container">
      <div class="row">

      <div class="col-md-5  toppad  pull-right col-md-offset-3 ">
       <br>
        <p class=" text-info"><?php echo $date; ?></p>

      </div>
        <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xs-offset-0 col-sm-offset-0 col-md-offset-3 col-lg-offset-3 toppad" >

          <div class="panel panel-info">
            <div class="panel-heading">
              <h3 class="panel-title">Buna venit, <?php echo $name." ".$prenume ?></h3>
            </div>
            <div class="panel-body">
              <div class="row">

                <div class=" col-md-9 col-lg-9 "> 
                  <table class="table table-user-information">
                    <tbody>

                      <form role="form" action="login.php" method="post">
                        <fieldset>
                            <div class="form-group">
                                <input type="text" name="hint" placeholder="Caută un angajat!" class="form-username form-control" id="hint">
                            </div>
                            <center><button type="submit" style="width:200px;" class="btn">Caută!</button></center>
                        </fieldset>
                    </form>

                    </tbody>
                  </table>
                  <a href="#" class="btn btn-primary">My Sales Performance</a>
                  <a href="#" class="btn btn-primary">Team Sales Performance</a>
                </div>
              </div>
            </div

          </div>
        </div>
      </div>
    </div>



    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/chart.min.js"></script>
    <script src="js/chart-data.js"></script>
    <script src="js/easypiechart.js"></script>
    <script src="js/easypiechart-data.js"></script>
    <script src="js/bootstrap-datepicker.js"></script>
    <script src="js/profile.js"></script>
    <script type="text/javascript">
        $(function() {
            $( "#hint" ).autocomplete({
                source: function( request, response ) {
                    $.ajax({
                        url: "gethint.php",
                        dataType: "jsonp",
                        data: {
                            q: request.term
                        },
                        success: function( data ) {
                            response( data );
                        }
                    });
                },
            });
        });     
    </script>   
</body>

</html>

Thanks in advance!

See also questions close to this topic

How can I define no limit while there is limit clause?
I have a procedure which gets one parameter as limitation:
```
call proc(2);
```
I use that number 2 in the query like this:
```
. . . LIMIT limitation
```
Noted that limitation is procedure parameter variable. Now sometimes I need to set a value which means "no limitation". How can I do that?

I can set a huge number like this: call proc(1000000000000000), but it doesn't seem nice.

In PHP configuration, when you set sometime to -1, it means no limitation. Now I'm looking for such a thing in MySQL.

null page is displayed and no error

I want to display the code bellow as a form input so if the user select update it moves it to this page in which the information are displayed based on the row that he select so I used the get in query , my problem is the page isn't display at all it display a null page and no error is appear. I'm really confused and the deadline of my project in 21 August.

<?php
    if (isset($_GET['name1'])){
        $namet=$_GET['name1'];
        $sql="SELECT OrgID,OrgName, City, OrgEmail, 
                    OrgPhoneNO, Trainingrequirements, WebsiteLink
              FROM oraganzation
              WHERE OrgName='$namet'";
        $result= mysqli_query($con,$sql) or die ("could not found; ".mysqli_error($con));

        while ($row=mysqli_fetch_array($result) ) {
            $orgid=$row['OrgID'];  
?>
    <form method="post"  action="orgUpdate.php">
        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['OrgName']?>" name="name" size="25" style="text-align: right;" class="form-control input-lg"></td>
            <td style="text-align: right;  font-weight: bold;">اسم المنظمة </td>
        </tr>
        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['City']?>" name="city" size="25" style="text-align: right;" class="form-control input-lg"></td>
            <td style="text-align: right;  font-weight: bold;">المدينة </td>
        </tr>

        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['OrgEmail']?>" name="email" size="25" style="text-align: right;" class="form-control input-lg"></td>
            <td style="text-align: right;  font-weight: bold;">الإيميل </td>
        </tr>

        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['OrgPhoneNO']?>" name="phone" size="25" style="text-align: right;" class="form-control input-lg"></td>
            <td style="text-align: right;  font-weight: bold;">رقم الهاتف </td>
       </tr>

        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['Trainingrequirements']?>" name="training" size="25" style="text-align: right;" class="form-control input-lg"></td>
            <td style="text-align: right; font-weight: bold;">التدريب الميداني </td>
        </tr>

        <tr>
            <td style="color:#94CDDE;"><input type="text" value="<?php echo $row['WebsiteLink']?>" name="website" size="25" style="text-align: right;"class="form-control input-lg"></td>
            <td style="text-align: right;  font-weight: bold;">رابط الموقع </td>
        </tr>

        <tr>
            <td><input type="submit" name="delete" value="حذف" class="btn btn-primary btn-lg " style="font-weight: bold;"></td>
            <td><input type="submit" name="submit" value="تحديث" class="btn btn-primary btn-lg " style="font-weight: bold;"></td>
        </tr>
        <br>
<?php
     }
}
?>

PHP not displaying errors. phpinfo shows display is on
I know there are numerous questions like this one but all say the same thing to do. I've done all of it and didn't succeed. This is really frustrating.

Everytime there's an error in any php file on my website the browser just stops outputting anything. I'm getting blank pages and no clue as to what is wrong and where. PHP is not giving any errors.

I've added display_error = on in the php.ini file and added this to my php files
```
ini_set('display_errors', 1);
error_reporting(E_ALL);
```
phpinfo(); is showing that display_error is on but I'm not getting anything at all. Please help.
I'm trying to trigger the HTML5 color picker's popup with JQuery
When an input[type=color] is clicked, a color picker opens in a popup window. I'd like to trigger this with JS.

HTML
```
<div id="customColorPick"></div>
<input id="customColorPickInput" type="color" />
```
JQuery
```
$("#customColorPick").click(function() {
    $("#customColorPickInput").click();
});
```
Why does this not work?
Decimal one place input type only number Ionic 3 latest version (3.9.2) I'm using
I'm using ionic latest version 3.9.2. and I'm facing one problem. I have one input box. input type number, when user input in text box they allow only one digit after the decimal. and in input box maximum only one decimal allow not more than one.
```
Examples: 
1) 1407.1
2) 6449496.8
3) 1.1
```
Like this only user can input one digit after decimal

Q.all promise never runs then callback

I am bit lost as to how Q.all works. I have the following code snippet (jsfiddle):

function callUrl(remoteEndPoint){
  return $.ajax({
    url: remoteEndPoint,
    method: "GET",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (data) {
      console.dir(data);
    },
    error: function (xhr, textStatus, errorThrown) {
            console.error("error");
    }
  });
}
Q.all([callUrl("https://httpbin.org/get"), callUrl("https://httpbin.org/undefined")]).then(function(){
    console.log("Done");
});

The first call to callUrl will succeed, the second will fail (will return an error as the url does not exist). I am expecting the Q.all to execute the then callback like what ajax.always does but this isn't the case.

Am I doing something wrong?

Input number with "+" and pointer
I have this simple input:
```
<input type="number" step="0.01">
```
This all inputs make success outputs:
a) 2.00
b) 2,00
c) +2,00

But input "+2.00" fail. I want to know why it happens. Js recognize "+2.00" as a number.
How to add 2 days in input html
This is my code I want to add 2 days from currentdate now, I mean if I borrow it now it will add 2 days from now and It will be better if I borrow it in friday, the saturdays and sundays will not count then It will direct to monday Thank you
```
<input type="hidden" name="due_date" id="sd" maxlength="10" style="border: 3px double #CCCCCC;" required/>
```
Does css3 allow mathematic calculation
I have a parent element and a child element like this
```
<parent element>

    <...>

         <...>

               <child element></child element>

         </...>

     <...>

</parent element>
```
I want to make the child element to receive the width of the parent/2.

I am wondergint, does CSS3 allow using something like:
```
child{
    width:parent().parent().parent().width/2 + "px"
}
```
I cant use jquery and I cant add any additional code to the HTML, I only have access to CSS file. Is this possible?
Why isn't JQuery showing my autocomplete fields?
Context: I'm attempting to setup JQuery autocomplete using data that gets sent in from the server. When a user changes a certain field, autofill data gets sent in from the backend such that they can select a supplied value if they so desire. The backend code is perfectly functional, as I can see the array of autocomplete data if I console.log(data)it on the frontend.

My issue is that, even though the frontend code is effectively requesting and receiving the autocomplete data, when I used JQuery's built in autocomplete options, it never shows the options on the frontend.

Here's my code:
```
$.ajax({
      type: "GET",
      url:"/autocomplete/"+event.target.id+"/"+$(this).val(),
      success : function(data){
        console.log(data);
        $(event.target.id).autocomplete({
          source: data
        });
      }
});
```
Where the event.target.id is the id of the input field that I'd like to autocomplete. Again, all of this works perfectly fine. When I console.log(data), it shows the array of items I want to use for autocomplete, but when I actually run
```
$(event.target.id).autocomplete({source:data});
```
It doesn't show any autocomplete options on the frontend.

Any idea as to how I can fix this? I've disabled my adblocker and tried it in a bunch of different browsers and the results never show as a standard dropdown-list autocomplete.
Is there a way to select current suggestion without leaving the main keyboard area visualstudio

I wonder if there is a way to select the current suggestion without leaving the main keyboard area (ie, without moving my hand to the up/down/left/right area of the keyboard)

Tab is not working, though it should be :-(
Xamarin google maps autocomplete

I'm trying to add an autocomplete service to my custom searchbar (I'm using an entry) on Xamarin forms for my Xamarin forms map, but I haven't been able to do so.

I already tried with XLabs but didn't work and I haven't found any other solution so far.

Does Xamarin.FormsMaps include any autocomplete function? Or is there any autocomplete function already on Xamarin that I may be missing? What do you recommend me? If you need any code or anything else, please let me know.

Related questions

Uncaught TypeError: autocomplete is not a function in jQuery

See also questions close to this topic