javascript - Load Remote JSON File for Autocomplete Flexdatalist in Wordpress -


i have json file contains addresses, states , postcodes information. utilized autocomplete flexdatalist show suggestions while user types in address. works when json file local (data: 'myr-mini.json'), when use url starts "http:/.." doesn't work. kindly me on one. in advance.

<input id="cp_address" name='myr address' type='text' class='flexdatalist' placeholder='write country name' size="40"> <input id='postcode' name='postcode' type='text' placeholder='enter zipcode' size="40">  <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js?ver=1.12.3'></script>     <script src="scripts/jquery.flexdatalist.js"></script> <script>      $('#cp_address').flexdatalist({      minlength: 2,      selectionrequired: true,      visibleproperties: ["value","state"],      searchcontain: true,      searchin: 'value',      searchdelay: 200,      noresultstext: 'no results found "{keyword}"',      data: 'https://studentsklm.com/wp-content/themes/classipress/myr-mini.json' }).on("select:flexdatalist",function(event, data){   $('#postcode').val(data.postcode); }); </script>

it appears cors issue trying hit url json data. below sample using myjson.com has cors enabled, , typing in "per" country input brings results:

$('#cp_address').flexdatalist({    minlength: 2,    selectionrequired: true,    visibleproperties: ["value", "state"],    searchcontain: true,    searchin: 'value',    searchdelay: 200,    noresultstext: 'no results found "{keyword}"',    data: 'https://api.myjson.com/bins/v588t'  }).on("select:flexdatalist", function(event, data) {    $('#postcode').val(data.postcode);  });
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js?ver=1.12.3'></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-flexdatalist/2.1.3/jquery.flexdatalist.min.js"></script>  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-flexdatalist/2.1.3/jquery.flexdatalist.min.css" />    <input id="cp_address" name='myr address' type='text' class='flexdatalist' placeholder='write country name' size="40">  <input id='postcode' name='postcode' type='text' placeholder='enter zipcode' size="40">


Comments

Post a Comment

Popular posts from this blog

javascript - Create a stacked percentage column -

i have collection of data : var data = [ {"p301a":"10","p301b":"7","p301c":"7","p301d":"3","p301e":"8","p301f":"8","p301g":"8","p301h":"8","p301i":"8","p301j":"8","p301k":"8","p301l":"8","p301m":"8","p301n":"8","p301o":"8","age":"31-40 years","profesion":"2","position":"2"}, {"p301a":"5","p301b":"4","p301c":"4","p301d":"4","p301e":"4","p301f":"4","p301g":"4","p301h":"4","p301i":"4","p301j":"4","p301k":"4...
Read more

Optimising Firebase database by automatically overwriting data -

in firebase app have following structure: posts latest all users can write posts > latest . want limit entries 20 posts save space in database. , posts beyond 20 unnecessary never shown on homepage. how can limit posts 20, when user writes posts > latest posts @ end drop off (be deleted) automatically? this sample should you. you need : const max_log_count = 20; exports.removeold = functions.database.ref('/posts/latest/{postid}').oncreate(event => { const parentref = event.data.ref.parent; return parentref.once('value').then(snapshot => { if (snapshot.numchildren() >= max_log_count) { let childcount = 0; const updates = {}; snapshot.foreach(function(child) { if (++childcount <= snapshot.numchildren() - max_log_count) { updates[child.key] = null; } }); // update parent. removes children. ...
Read more

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -

Image
each grid cell can have more 1 customtemplate loaded. have directive holds watcher on model_col_field listen cell updates on scroll when dom rows updated , recompile celltemplate . without watcher , $compile rows repeat on scroll, showing same set of rows. is there more angular way of approaching or way improve performance? relevant controller code: create gridoptions.data & gridoptions.columndefs : var customtemp = '<div ng-repeat="opt in grid.appscope.colvalueoptionsmodel" ng-init="tempstring=model_col_field.clazz+opt.key;"><comparison-directive dbo="model_col_field" attobj="opt" fff="grid.appscope.getattributetemplate(tempstring)" /></div>'; $scope.gridoptions.columndefs = [ { name:'yindex',pinnedleft:true,celltemplate: customtemp, displayname:'index'}, { name:'col1',celltemplate: customtemp}, { name:'col2',celltemplate: c...
Read more