git://git.onelab.eu / unfold.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
imported the whole jquery-ui package, refreshed with 1.10.2
[unfold.git] / third-party / jquery-ui-1.10.2 / demos / autocomplete / xml.html
diff --git a/third-party/jquery-ui-1.10.2/demos/autocomplete/xml.html b/third-party/jquery-ui-1.10.2/demos/autocomplete/xml.html
new file mode 100644 (file)
index 0000000..e16b9e1
--- /dev/null
+++ b/third-party/jquery-ui-1.10.2/demos/autocomplete/xml.html
@@ -0,0 +1,66 @@
+<!doctype html>
+<html lang="en">
+<head>
+       <meta charset="utf-8">
+       <title>jQuery UI Autocomplete - XML data parsed once</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; }
+       </style>
+       <script>
+       $(function() {
+               function log( message ) {
+                       $( "<div/>" ).text( message ).prependTo( "#log" );
+                       $( "#log" ).attr( "scrollTop", 0 );
+               }
+
+               $.ajax({
+                       url: "london.xml",
+                       dataType: "xml",
+                       success: function( xmlResponse ) {
+                               var data = $( "geoname", xmlResponse ).map(function() {
+                                       return {
+                                               value: $( "name", this ).text() + ", " +
+                                                       ( $.trim( $( "countryName", this ).text() ) || "(unknown country)" ),
+                                               id: $( "geonameId", this ).text()
+                                       };
+                               }).get();
+                               $( "#birds" ).autocomplete({
+                                       source: data,
+                                       minLength: 0,
+                                       select: function( event, ui ) {
+                                               log( ui.item ?
+                                                       "Selected: " + ui.item.value + ", geonameId: " + ui.item.id :
+                                                       "Nothing selected, input was " + this.value );
+                                       }
+                               });
+                       }
+               });
+       });
+       </script>
+</head>
+<body>
+
+<div class="ui-widget">
+       <label for="birds">London matches: </label>
+       <input id="birds" />
+</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>This demo shows how to retrieve some XML data, parse it using jQuery's methods, then provide it to the autocomplete as the datasource.</p>
+<p>This should also serve as a reference on how to parse a remote XML datasource - the parsing would just happen for each request within the source-callback.</p>
+</div>
+</body>
+</html>
myslice (django)