Search code examples
javascriptjquerymaterialize

How to resolve AutoComplete is not a function with materializecss?


So, I am using autocomplete in one of my field with materialize css but i wonder why i am getting this error?

Uncaught TypeError: $(...).autocomplete is not a function
    at HTMLDocument.<anonymous> (edit_view.php?id=48:568)
    at j (jquery-2.1.1.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-2.1.1.min.js:2)
    at Function.ready (jquery-2.1.1.min.js:2)
    at HTMLDocument.I (jquery-2.1.1.min.js:2)

and this is my function:

<script type="text/javascript">
    $(document).ready(function() {
        $(function() {
            $.ajax({
                type: 'GET',
                url: 'http://127.0.0.1/EnrollmentSystem/views/employee/departments.php',
                success: function(response) {
                    var departmentArray = response;
                    var dataDepartment = {};
                    for (var i = 0; i < departmentArray.length; i++) {
                        console.log(departmentArray[i].name);
                        dataDepartment[departmentArray[i].name] = departmentArray[i].flag;
                    }
                $('input.autocomplete').autocomplete({
                    data: dataDepartment,
                });
                }
            });
        });
    }); 
</script>

and calling it here:

<div class="col s12 m8 l8">
    <input type="text" id="department" name="department_id" value="<?php echo $department['name'] ;?>" class="autocomplete">
</div>

I tried different version of JQuery but i got no luck. These are my declartion for getting Javascript:

<script type = "text/javascript"
src = "https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"></script>

I tried different suggestion here in stackoverflow but nothing works on my case. Hope someone can point out how can i solve this error


Solution

  • Autocomplete isn't available in 0.97.3, it was added in 1.0.0 (along with the other forms-related capabilities). Also, 1.0.0 isn't dependent on jQuery so the semantics are different. Documentation for Autocomplete in 1.0.0 is over here.