Nsryjdtyk

I'm using jQuery's Autocomplete to get data while the user is typing. It works; I get some zipcode that matches the user's input.

The thing is that I want to pass more than the zipcode, like the neighborhood associated with that zipcode. Both are in the same table.

I want to pass the zipcode AND the neighborhood in the autocomplete.

Controller:

<?php



namespace Grupo_VillanuevaHttpControllers;



use IlluminateHttpRequest;

use IlluminateSupportFacadesDB;

use IlluminateSupportFacadesResponse;



class SearchController extends Controller

{

    public function buscarCp(Request $request)

    {



        $term = $request->input('term');



        $results = ;



        $queries = DB::connection('db_postalcodes')

            ->table('postal_code')

            ->where('postal_code', 'LIKE', '%' . $term . '%') //search 'postal_code' column

            ->take(10)

            ->get(); // get 5 results



        foreach ($queries as $query) {

            $results = [

                'postal_code' => $query->postal_code,

                'value' => $query->postal_code,

                'colonia' => $query->neighborhood];

        }



        return Response::json($results);

    }

}

I thought about fetching it with the colonia inside the associative array, though I'm not an expert.

JS:

@if (Request::is('admin/posts/create'))

{{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script> --}}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script>

    $('.postalCode').autocomplete({

        source: "{{ route('busqueda-cp') }}",

        minLength: 3,

        select: function (event, ui) {

            $('#postalCode').val(ui.item.value);

        }

    });

</script>

@else

<!-- No se cargó select2-->

@endif

Route:

// Aquí se guarda la función que hace, vía ajax, búsqueda de código postal.

Route::get('/buscarCp', 'SearchController@buscarCp')->name('busqueda-cp');

You can concatenate strings together using . between strings. In your $results variable:

'value' => $query->postal_code . ' ' . $query->neighborhood,

You can concatenate any number of strings together this way:

$query->postal_code . ' ' . $query->neighborhood . ' (' . $query->foo . ') ' . $query->bar

If you wanted to keep the array value from php you could use autocomplete's _renderItem method as seen here.

So your code would look like this:

$('.postalCode').autocomplete({

    source: "{{ route('busqueda-cp') }}",

    minLength: 3,

    select: function (event, ui) {

        $('#postalCode').val(ui.item.value);

    }

}).autocomplete( "instance" )._renderItem = function( ul, item ) {

  return $( "<li>" )

    .append( item.postal_code + " " + item.colonia )

    .appendTo( ul );

};

Then you could use the value and just change the way the select items look.