diff options
| author | Alvin Li <liweitianux@gmail.com> | 2013-08-22 15:18:58 +0800 |
|---|---|---|
| committer | Alvin Li <liweitianux@gmail.com> | 2013-08-22 15:18:58 +0800 |
| commit | 3f1d09f3b5b86157ccf9f47eef69a065be6153a4 (patch) | |
| tree | 84d424db169cea7daff7dc2ed7e045de15ec86eb /97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html | |
| parent | 3ef1e03e4273544cce177ce7fa0e0ab75eded990 (diff) | |
| download | 97dev-3f1d09f3b5b86157ccf9f47eef69a065be6153a4.tar.bz2 | |
* added latest full package of 'jquery-ui' plugin, v1.10.3;
* improved 'thickbox' plugin to use 'jquery-1.9.x';
* upgraded 'SheetDefault.html', 'NewDeleteIndex.html' and other pages
to use 'jquery-1.9.x';
* improved 'IndexDesc.html' to deal with the problem of no related
annotation found;
* 'indicator.tools.get_record()' added param 'number', and updated
the format of return data;
* added 'get_num_record()' and 'get_num_record_std()' to
'indicator.tools';
* improved 'indicator.views.ajax_get_card_data_chart()',
now can get data by 'num' or by 'date';
* improved 'indicator.views.ajax_get_card_data_table()',
to provide the needed data requested from 'detail_card';
* improved js function 'chart_getdata_draw()' in 'SheetDefault.html';
* 'card_chart.js': renamed 'redraw_chart()' to
'detail_chart_getdata_draw()', and updated to get data by type;
* updated 'table' of 'detail_card' in 'SheetDefault.html';
* improved js function 'get_card_data_table()' for providing and
displaying record data in 'detail_card' table.
TODO:
* add/delete/edit record data
Diffstat (limited to '97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html')
| -rw-r--r-- | 97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html b/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html new file mode 100644 index 0000000..49083bd --- /dev/null +++ b/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/autocomplete/remote-jsonp.html @@ -0,0 +1,82 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Remote JSONP datasource</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.9.1.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.menu.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-loading { + background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; + } + #city { width: 25em; } + </style> + <script> + $(function() { + function log( message ) { + $( "<div>" ).text( message ).prependTo( "#log" ); + $( "#log" ).scrollTop( 0 ); + } + + $( "#city" ).autocomplete({ + source: function( request, response ) { + $.ajax({ + url: "http://ws.geonames.org/searchJSON", + dataType: "jsonp", + data: { + featureClass: "P", + style: "full", + maxRows: 12, + name_startsWith: request.term + }, + success: function( data ) { + response( $.map( data.geonames, function( item ) { + return { + label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName, + value: item.name + } + })); + } + }); + }, + minLength: 2, + select: function( event, ui ) { + log( ui.item ? + "Selected: " + ui.item.label : + "Nothing selected, input was " + this.value); + }, + open: function() { + $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); + }, + close: function() { + $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); + } + }); + }); + </script> +</head> +<body> + +<div class="ui-widget"> + <label for="city">Your city: </label> + <input id="city"> + Powered by <a href="http://geonames.org">geonames.org</a> +</div> + +<div class="ui-widget" style="margin-top:2em; font-family:Arial"> + Result: + <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +<div class="demo-description"> +<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are cities, displayed when at least two characters are entered into the field.</p> +<p>In this case, the datasource is the <a href="http://geonames.org">geonames.org webservice</a>. While only the city name itself ends up in the input after selecting an element, more info is displayed in the suggestions to help find the right entry. That data is also available in callbacks, as illustrated by the Result area below the input.</p> +</div> +</body> +</html> |