JAVASCRIPT

jquery autocomplete search

 $(document).on('keyup', ".floor_name", function(){
                if(!$("#project_id").val()){
                    alert("Select Project Name First");
                }else{
                    let project_id  = $("#project_id").val();
                    $(this).closest('tr').find('.floor_id').val('');
                    $(this).autocomplete({
                        source: function( request, response ) {
                            $.ajax({
                                url:"{{route('scj.floorAutoSuggest')}}",
                                type: 'post',
                                dataType: "json",
                                data: {
                                    _token: CSRF_TOKEN,
                                    search: request.term,
                                    project_id: project_id
                                },
                                success: function( data ) {
                                   
                                    if (data.length > 0) {
                                        response( data );
                                } else {
                                    //If no records found, set the default "No match found" item with value -1.
                                    
                                    response([{ 
                                        label: 'No results found.',
                                        val: -1,
                                        floor_id: null
                                    }]);
                                }
                                },
                                error: function(xhr, status, error) {
                                }
                            });
                        },
                        select: function (event, ui) {
                            if (ui.item.val == -1) {
                                $(this).val("");
                                $(this).closest('tr').find('.floor_id').val(ui.item.floor_id);
                                return false;
                            }
                            $(this).val(ui.item.label);
                                $(this).closest('tr').find('.floor_name').val(ui.item.label);
                                $(this).closest('tr').find('.floor_id').val(ui.item.floor_id);
                        }
                    });
                }
            });

jquery autocomplete select

$( ".selector" ).autocomplete({
  appendTo: "#someElem"
});