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

Count of fields code works in one server and does not work in another server

I am trying to select fields with a condition and display their counts. The counts display in one server while the same code does not display counts ($num01 and $rowno)in another server. Both servers have same PHP version (5.6) and same database structure. Please guide.

Following is my code -

$con=mysqli_connect($host,$user,$password,$dbname);
$sql="select num, ode_y from Topics order by num asc";

$result = mysqli_query($con,$sql);

$sql1="SELECT * from Topics ORDER BY num ASC";
$result1=mysqli_query($con,$sql1);
$rowno = mysqli_num_rows($result1);

<span>Total $rowno registered 
topics</span>

while($row = mysqli_fetch_array($result))
  { 
$odey1= ($row['ode_y']);

    $sql01="SELECT ode  from fltr2 AS s INNER JOIN Register AS r ON 
 s.sender=r.sender and r.reg=0 and s.ode='$odey1'";

    $result01 = mysqli_query($con,$sql01);
    $num01=mysqli_num_rows($result01);

 <div>Counts : ".$num01."</a>
 </div>
}

How to be a developper back end

I am a young student, I have already studied language PHP and its framework LARAVEL and the framework seen JS of Javascript.

I want to end the route of a developer back end, but I have some questions Pliz:

- why most utiliste the ANGULAR JS even if in the documentation of VIEW JS we find that it is better a lot that Angular ? - Which language I have to master furthermore to be a developer back end ?

thank you in advance
Wordpress Uncode Theme Woocommerce Product Image Issue
I have a problem ,the product images are not showing up, if you check this product link you might see the images, but if you refresh they will disappear at some point.

The client is using Uncode Visual Composer to display the products.

I turned wp_debug true , and im not sure if the PHP error is the problem with this.

Here is a screenshot

The code from line 41/42.
```
if ($image_attributes->post_mime_type === 'image/gif' || $image_attributes->post_mime_type === 'image/url') $crop = false;
        $image_resized = uncode_resize_image($image_attributes->id, $image_attributes->guid, $image_attributes->path, $image_metavalues['width'], $image_metavalues['height'], 5, ($crop ? 5 / $thumb_ratio : null), $crop);
```

How to replace an appendChild instead of it adding to the previous appendChild?

I created a simple simple javascript program where when I click two buttons that I generate random numbers and the third button allows me to sum the two numbers up and then I can reset.

https://codepen.io/Groundedelectron/pen/JJrdXO

<html lang="en">
<head>
<title>createTextNode example</title>
</head>

<body>
  <button onclick="addTextNode1('Hi!');">N. 1</button>
  <button onclick="addTextNode('NO! ');">N. 2</button>
  <button onclick="test2('NO!.. ');">A! </button>
<button onclick="myFunction3()">Reset page</button>
  <hr />
  <p id="p2">1: </p>
  <p id="p1">2: </p>
  <p id="p3">T: </p>
</body>
</html>

function addTextNode(simple1) {
  text1 = Math.floor((Math.random() * 100) + 1);
  var newtext = document.createTextNode(text1+"     "),
      p1 = document.getElementById("p1");

  p1.appendChild(newtext);
}

function addTextNode1(simple2) {
  text2 = Math.floor((Math.random() * 100) + 1);
  var newtext = document.createTextNode(text2+"     "),
      p2 = document.getElementById("p2");

  p2.appendChild(newtext);
}


function myFunction3() {
    window.location.reload(true);
}

function test2() {
    text5 = text1 + text2;
    var newtext5 = document.createTextNode(text5),
      p3 = document.getElementById("p3");

     p3.appendChild(newtext5);
}

My question is how would I be able to replace the number that was newly displayed by the button by the appendChild method, so that when I click the button again the previous number gets replaced.

Thanks! Much appreciate!

Compartilhar conteúdo de uma janela modal Bootstrap

Estou desenvolvendo um site para um cliente one page no wordpress e nesse site só estou usando link âncora no menu. O cliente pediu que coloque os botões de compartilhamento de redes sociais dentro dessa janela modal, mas quando coloco e compartilho o conteúdo só leva para página inicial do site. Seria possível compartilhar o conteúdo dessa tela e quando o usuário clicar na publicação do facebook por exemplo abrir o site com essa tela modal já aberta? OBS: Os links que abrem essa janela modal serão atualizados periodicamente.

Change canvas data source using processingjs

At the moment, I am using processingjs for sketches on a canvas. But as of right now, I want to make it possible to click on a button that changes the sketch in the canvas. So I though I might be able to pull this off by changing the data source using jQuery. Well, that doesn't work as processing only reads the pde file at load. So here's my code:
HTML:

<html>
    <head>
        <script src="jQuery.js"></script>
        <script src="processing.min.js"></script>
        <script src="main.js"></script>
        <link rel="stylesheet" type="text/css" href="stylesheet.css">
    </head>
    <body>
        <div id="canvas">
            <canvas id="canvas1" data-processing-sources="anything.pde"></canvas>
        <div id="buttons">
            <div>
                <button id="clickMe">?</button>
            </div>
        </div>
        </body>
</html>

jQuery:

$(document).ready(function(){   
    $('#clickMe').click(function(){
      change();
    });

function change() {

    $('#canvas1').remove();

    $( "#canvas" ).append("<canvas id='canvas2' data-processing-sources='other.pde'></canvas>");

}


});

and then the PDE file:

void setup()
{
    size(300, 300);
    background(1000);
    fill(255);
    noLoop();
    PFont fontA = loadFont("courier");
    textFont(fontA, 14);  
}

void draw(){  

    text("Hello Web!",20,20);
    println("Hello ErrorLog!");
    ellipse(20, 20, 20, 20);
}

So I was hoping for this to work but I read that it draws on page load.

So how can I achieve this? How can I make it so that a button click can change the sketch?
I've come to SO for this as I do not really understand what the processingjs website is telling me.
Does anyone know how to do this? I would appreciate it greatly!

Dynamically create elements using JQuery

I'm trying to dynamically create a div block for my slider and it's created whenever the currently playing song changes and i just can't get it to work properly. Also how would you recommend dealing with the song, artist and album names. I realise id means it's unique so only the first block would render correctly and then the other blocks would have no data showing up. Is there a way I can create unique id's for each block in the jquery without it being in the html?

Here's how it looks

Here's the HTML:

<div class="swiper-wrapper">
                  <div class="swiper-slide">
                    <div class="getCurrentTrack">
                      <div id="trackTemplate">
                          <img id="trackimg" width="350" height="350" />
                          <figcaption id="songName"></figcaption>
                          <figcaption id="artistName"></figcaption>
                          <figcaption id="albumName"></figcaption>
                          <img class="invert" id ="add" src="http://indianassist.mx/img/downArrow.png" height="20" width="20" />
                      </div>
                    </div>
                  </div>
                  <div class="swiper-slide">
                    <div class="getCurrentTrack">
                      <div class="trackTemplate">
                          <img src="https://s-media-cache-ak0.pinimg.com/736x/24/28/10/242810087197ad884c0d895c2953a740.jpg" width="350" height="350" />
                          <figcaption id="songName">songName</figcaption>
                          <figcaption id="artistName">songName</figcaption>
                          <figcaption id="albumName">songName</figcaption>
                          <img class="invert" id ="add" src="http://indianassist.mx/img/downArrow.png" height="20" width="20" />
                      </div>
                    </div>
                  </div>
                  <div class="swiper-slide">
                    <div class="getCurrentTrack">
                      <div class="trackTemplate">
                          <img src="https://s-media-cache-ak0.pinimg.com/736x/24/28/10/242810087197ad884c0d895c2953a740.jpg" width="350" height="350" />
                          <figcaption id="songName">songName</figcaption>
                          <figcaption id="artistName">songName</figcaption>
                          <figcaption id="albumName">songName</figcaption>
                          <img class="invert" id ="add" src="http://indianassist.mx/img/downArrow.png" height="20" width="20" />
                      </div>
                    </div>
                  </div> 
                </div>

The JS:

var swiperSlide = document.createElement('div');
                            swiperSlide.className = 'swiper-slide';

                            var getCurrentTrack = document.createElement('div');
                            getCurrentTrack.className = 'getCurrentTrack';

                            var trackTemplate = document.createElement('div');
                            trackTemplate.className = 'trackTemplate';

                            var image = document.createElement('img');
                            image.src = jsonPushData.songURL;
                            image.height = 400;
                            image.width =400;

                            var song = document.createElement('figcaption');
                            song.text = jsonPushData.songName;

                            var artist = document.createElement('figcaption');
                            artist.text = jsonPushData.artistName;

                            var album = document.createElement('figcaption');
                            album.text = jsonPushData.albumName;

                            var add = document.createElement('img');
                            add.src = document.getElementById('add').src;

                            trackTemplate.appendChild(image);
                            trackTemplate.appendChild(song);
                            trackTemplate.appendChild(artist);
                            trackTemplate.appendChild(album);
                            trackTemplate.appendChild(add);

                            getCurrentTrack.appendChild(trackTemplate);
                            swiperSlide.appendChild(getCurrentTrack);

                            $('swiper-wrapper').prepend(swiperSlide);

Website security, redirecting

Can you tell me how to create website security? I mean, when you have form with POST method, and you send user information to the next page by the button, then works correctly. But when you view source code, and see this next page name, and enter in to the address bar, it declines your connection.

Example: Button on html.html redirects You to php.php, works correctly. You are entering php.php in address bar, it kicks you to html.html, because webiste know you are not on site in the way you wanted.

Slight issue parsing text into html

Hmmmm, this may well be an easy one but may well be a complex one. I'm having an issue setting up an SEO friendly Twitter feed within the Django framework. Most of the heavy lifting is done as a template tag blog_tags.py file as follows:

@register.inclusion_tag('blog/frame/twitter.html')
def show_latest_tweets():
    tweets = []

    try:
        """The import error is here to catch any server migrations were the tweepy package not to be found in site_packages"""
        import tweepy
    except:
        tweets.append({'status': 'There was a problem referencing our tweets. Please inform our webmaster.', 'relative_date': 'Just now'})
        raise ImportError

    # OAuth process, using the keys and tokens
    auth = tweepy.OAuthHandler(settings.EOS_TWITTER_FEED['EOS_FEED_TWITTER_KEY'], settings.EOS_TWITTER_FEED['EOS_FEED_TWITTER_SECRET'])
    auth.set_access_token(settings.EOS_TWITTER_FEED['EOS_FEED_TWITTER_ACCESS_TOKEN'], settings.EOS_TWITTER_FEED['EOS_FEED_TWITTER_ACCESS_TOKEN_SECRET'])

    # Creation of the actual interface, using authentication
    api = tweepy.API(auth)

    user = 'FFXVEN'

    avatar_url = api.get_user(screen_name='@'+user).profile_image_url

    i = 0
    for tweet in tweepy.Cursor(api.user_timeline, screen_name='@'+user).items():
        if 'RT' not in tweet.text:
            if i <= 4:
                status = tweet.text
                hashtags = [word for word in status.split() if word[0] == "#"]

                #Find hashtags in tweet and create a string to contain <a href="https://twitter.com/search?q=" + hashtag>#hashtag</a>
                for hashtag in hashtags:
                    if hashtag.endswith((',',';','.')):
                        hashtag = hashtag[:-1]

                    status = status.replace(hashtag, '<a href="https://twitter.com/search?q={}">{}</a>'.format(hashtag[1:], hashtag))

                relative_date = tweet.created_at
                tweets.append({'user': user, 'avatar_url': avatar_url, 'status': html.unescape(status), 'relative_date': relative_date})
                i += 1
            else:
                break
        else:
            continue

    return { "tweets": tweets }

All works well - it returns everything I want and currently it strips the hashtags out and replaces them with Twitter friendly hashtags. HOWEVER, client side this is what is displayed:

I'm stuck on how I would work it such that client side the html elements are rendered as html elements and not pre-formatted text?

How to autocomplete an input field when live search result is clicked

I have an input field which can be used for live search and result will be shown inside a table .Created using ajax,PHP and jquery.

The live results from database is displaying fine.But I don't know how to make the field autocomplete when the user clicks on result.

here is the html code for input field and the live search result.

<div class="form-group">
<label>Executive Name</label>
<input type="text" id="search_text" name="search_text" 
 placeholder="search name" class="form-control">

<div id="result"></div>                              
</div>

This is the jquery and ajax script

$(document).ready(function(){
       load_data();

       function load_data(query){
           $.ajax({
               url:"backend/livesearch.php",
               method:"POST",
               data:{query:query},
               success:function(data){
                   $("#result").html(data);
               }
           });
       }

       $("#search_text").keyup(function(){
           var search=$(this).val();
           if(search!==''){
               load_data(search);
           }
           else{
               load_data();
           }
       });


    });

The php page "livesearch.php"

<?php require 'connect.php';
    $output="";
    if(!empty($_POST['query'])){
        $search= '%'.mysqli_real_escape_string($link,$_POST['query']).'%';
        $query="SELECT id,name FROM users WHERE name like '$search'";
        $result= mysqli_query($link4, $query);
        $output .="<div class='table-responsive'>
                  <table class='table table-bordered table-sm'>
                  <tbody>";
        if(mysqli_num_rows($result)>0){

          while($row= mysqli_fetch_array($result)){
              $output .="<tr class='search-cell'>
                      <td>".$row['name']."</td>
                      </tr>";
          }
          $output .="</tbody></table></div>";
        }
        else{
            $output .="<tr><td>No Result !</td></tr></tbody></table></div>";
        }
    }

    echo $output;
    ?>

Visual Studio 2017 not auto-completing some XAML tags

I am currently learning about Xamarin.Forms and XAML using Visual Studio 2017. Intellisense seems to be working for XAML files for the most part, but there is at least one tag it doesn't autocomplete, which is OnPlatform. And when I manually write the tag, it doesn't autocomplete attributes like x:TypeArguments. However, it compiles and runs just fine with the OnPlatform element.

Is it normal that Intellisense does not work for a (seemingly random) tag? Are there certain tags that are not auto-completed on purpose?
How to achieve Vim style case sensitive auto completion in emacs?

For example, in Vim, if current buffer contains a word "Random", and I type "random" then Ctrl-n, it will be changed to "Random".

But in emacs, it says 'No dynamic expansion for "random" found'.

Is there anyway I can achieve the same effect?

Related questions

Uncaught TypeError: autocomplete is not a function in jQuery

See also questions close to this topic