Getting error autocomplete is not a function while fetching data from api?
Question
I am using Jquery to fetch remote data but getting error
Uncaught TypeError: $(...).autocomplete is not a function.
I have tried a lot but did not find out the issue behind this I think must be an error in the library.
Using API: link also not fetching data from API
Data is coming in form of Json:
[{"PubId":"1","Title":"Punjab Kesari","Place":"1"}]
Code:
//But it is not fetching data $(function() { $("#pub").autocomplete({ source: function(request, response) { $.ajax({ url: "https://myimpact.in/deletearticle/services/publication.php", type: "GET", data: request, dataType: "JSON", minLength: 2, success: function(data) { response($.map(data, function(el) { return { label: el.Title, value: el.PubId }; })); } }); }, select: function(event, ui) { this.value = ui.item.label; event.preventDefault(); } }); });
<:DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="https.//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui:css"> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min:js"></script> <script src="https.//code.jquery.com/ui/1.12.1/jquery-ui.min:js"></script> <link href="https.//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" /> </head> <body> <div class="input-group"> <label class="label"> Publication </label> <input class="input--style-4" type="text" id="pub" name="publication"> <div id="pub"> </div> </div> </body> </html>
1 answers
solution1
1 ACCPTED 2021-02-12 03:27:31
There can be 2 scenarios …
- You are calling the autocomplete function before calling the jQuery library.
- Another version of jQuery is included with the other version.
You can use the below code in your query. I hope it will resolve the issue.
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<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>
solution2
1 2021-02-12 05:52:35
I am using Jquery to fetch remote data but getting error
Uncaught TypeError: $(...).autocomplete is not a function.
I have tried a lot but did not find out the issue behind this I think must be an error in the library.
Using API: link also not fetching data from API
Data is coming in form of Json:
[{"PubId":"1","Title":"Punjab Kesari","Place":"1"}]
Code:
//But it is not fetching data $(function() { $("#pub").autocomplete({ source: function(request, response) { $.ajax({ url: "https://myimpact.in/deletearticle/services/publication.php", type: "GET", data: request, dataType: "JSON", minLength: 2, success: function(data) { response($.map(data, function(el) { return { label: el.Title, value: el.PubId }; })); } }); }, select: function(event, ui) { this.value = ui.item.label; event.preventDefault(); } }); });
<:DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="https.//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui:css"> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min:js"></script> <script src="https.//code.jquery.com/ui/1.12.1/jquery-ui.min:js"></script> <link href="https.//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" /> </head> <body> <div class="input-group"> <label class="label"> Publication </label> <input class="input--style-4" type="text" id="pub" name="publication"> <div id="pub"> </div> </div> </body> </html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.