Codeigniter + Autocomplete Jquery UI does not return list

Question

Good afternoon, everyone,

I have a search field where I give "suggestions" of what to type, based on what I have registered in my database. The same was working perfectly, but it stopped working and I can’t find the error.

Script:

<script>
    $(function(){
        $('#query').autocomplete({
            source: "<?php echo site_url('artigos/sugestao'); ?>"
        });
    });
</script>

Controller:

public function sugestao()
{
    if(esta_logado() == TRUE){
        if(isset($_GET['term'])){
            $result = $this->artigos->sugestao($_GET['term']);
            if(count($result) > 0){
                foreach ($result as $r)
                    $arr_result[] = $r->titulo;
                echo json_encode($arr_result);
            }
        }
    } else {
        redirect('/login');
    }
}

Model:

public function sugestao($palavraChave)
{
    $query = $this->db->query("//select que utilizo");
    return $query->result();
}

if I test call this way in the browser http://localhost/articles/sugestao? term=Profanity it returns the result normally, but at the time I type in the input it does not show the listing as it was done before.

Thanks in advance!

Answer 1

You’ll have to use AJAX to do this, as you are using $_GET to search you will need to use $.get()

jQuery("#query").autocomplete({
    source: function (request, response) {
        jQuery.get("<?php echo site_url('artigos/sugestao'); ?>", {
            term: request.term
        }, function (data) {
            response(data);
        });
    },
    minLength: 3 // define o número mínimo de caracteres digitados antes de fazer a busca
});

Answer 2

David, I see you’re using the autocomplete. If the proposed result is brought via browser, the problem is in Jquery.

Check:

• If the Chrome element inspector console displays an error (Chrome > F12)
• If the field with id #query exists
• If the path brought by <?php echo site_url('artigos/sugestao'); ?> is valid (display the source code on the page and see the URL explicitly expressed), because suddenly you modified something and do not remember or even a simple .htaccess may have spoiled the fun.

You can also manually execute the request in the Chrome element inspector (F12) console (just paste and ENTER):

$('#query').autocomplete({
    source: "URL_COMPLETA_AQUI"
});

This way you can see the return or error that JQUERY might pop.