Title: JQuery UI autocomplete and EasyUI not compatible Post by: fguibert on May 18, 2018, 02:30:54 AM Hi
I'm trying to integrate the JQueryUI autocomplete plugin in my EasyUI application (to create a street/postalcode/city widget), but I get a error on my EasyUI accordion menu : Code: jquery.min.js:2 Uncaught Error: no such method 'select' for accordion widget instance I'm using EasyUI 1.5.5 and JQueryUI 1.12.1 my page looks like this : first, call EasyUI lib's : Code: <link rel="stylesheet" id="stylesheetJeasyui" type="text/css" href="/InSquare/resources/css/default/easyui.css"> <script type="text/javascript" src="/InSquare/resources/js/jquery.min.js"></script> <script type="text/javascript" src="/InSquare/resources/js/jquery.easyui.min.js"></script> <script type="text/javascript" src="/InSquare/resources/js/locale/easyui-lang-fr.js"></script> then create the menu : Code: <body> ... <div class="easyui-accordion" id="acc" data-options="fit:false,border:false,animate:false"> <div title="First" style="padding:10px;"> Content 1 </div> <div title="Second" style="padding:10px;"> Content 2 </div> </div> ... and select the second menu item : Code: <script> $(function(){ $('#acc').accordion('select','Second'); }); </script> and finally, create the autocomplete textbox with JUI : I follow others recomandations on the forum to include the script inside body, but the error above is always raised : Code: <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script> <input name="cp" id="cp" type="text" placeholder="CP"> <script> $(function(){ $("#cp").autocomplete({ source: function (request, response) { $.ajax({ url: "https://api-adresse.data.gouv.fr/search/?postcode="+$("input[name='cp']").val(), data: { q: request.term }, dataType: "json", success: function (data) { var postcodes = []; response($.map(data.features, function (item) { // Ici on est obligé d'ajouter les CP dans un array pour ne pas avoir plusieurs fois le même if ($.inArray(item.properties.postcode, postcodes) == -1) { postcodes.push(item.properties.postcode); return { label: item.properties.postcode + " - " + item.properties.city, city: item.properties.city, value: item.properties.postcode }; } })); } }); } }); }); </script> Any help greatly appreciated !! Title: Re: JQuery UI autocomplete and EasyUI not compatible Post by: jarry on May 18, 2018, 05:07:42 AM Please try this code:
Code: <input name="cp" id="cp" type="text" placeholder="CP"> <input id="cc"> <script type="text/javascript"> $(function(){ $('#cc').combobox({ mode: 'remote', valueField: 'value', textField: 'label', loader: function(param, succ){ if (!param.q){return;} $.ajax({ url: "https://api-adresse.data.gouv.fr/search/?postcode="+$("input[name='cp']").val(), data: {q:param.q}, dataType: 'json', success: function(data){ var rows = $.map(data.features, function(item){ return { label: item.properties.postcode + " - " + item.properties.city, city: item.properties.city, value: item.properties.postcode }; }); succ(rows) } }) } }) }) </script> Title: Re: JQuery UI autocomplete and EasyUI not compatible Post by: fguibert on June 07, 2018, 03:02:40 AM thanks a lot jarry I've not been notified of your answer, but it's exactly what I finally do
so, no way to use this Jquery autocomplete component in our JeasyUi app |