github
Advanced Search
  • Home
  • Pricing and Signup
  • Explore GitHub
  • Blog
  • Login

jquery / jquery-ui

  • Admin
  • Watch Unwatch
  • Fork
  • Your Fork
  • Pull Request
  • Download Source
    • 256
    • 29
  • Source
  • Commits
  • Network (29)
  • Graphs
  • Tree: 1382af8

click here to add a description

click here to add a homepage

  • Switch Branches (4)
    • bind
    • master
    • panel
    • tooltip
  • Switch Tags (15)
    • 1.8rc3
    • 1.8rc2
    • 1.8rc1
    • 1.8b1
    • 1.8a2
    • 1.8a1
    • 1.8
    • 1.7
    • 1.6rc6
    • 1.6rc5
    • 1.6rc3
    • 1.6rc2
    • 1.6
    • 1.5.2
    • 1.5.1
  • Comments
Sending Request…

The official jQuery user interface library. — Read more

  Cancel

http://jqueryui.com/

  Cancel
  • Private
  • Read-Only
  • HTTP Read-Only

This URL has Read+Write access

autocomplete: added xml-parsing demo
jzaefferer (author)
Tue Jan 26 12:52:21 -0800 2010
commit  1382af8af0196a0bce10d8c58f449d2320cdf8a9
tree    13a1e5cadc625f90de40c187d05a1eddc0de3da8
parent  c3dd4ac373660b1d36eb527a7ad1387d5d39ef9d
M demos/autocomplete/index.html 1 •
A demos/autocomplete/london.xml 114 •••••
A demos/autocomplete/xml.html 68 •••••
Txt demos/autocomplete/index.html
  • View file @ 1382af8
... ... 
@@ -14,6 +14,7 @@
14 14 
       <li><a href="remote-jsonp.html">Remote JSONP datasource</a></li>
15 15 
       <li><a href="combobox.html">Combobox</a></li>
16 16 
       <li><a href="custom-data.html">Custom data and display</a></li>
  17 
+      <li><a href="xml.html">XML data parsed once</a></li>
17 18 
     </ul>
18 19 
   </div>
19 20 
 </body>
Txt demos/autocomplete/london.xml
  • View file @ 1382af8
... ... 
@@ -0,0 +1,114 @@
  1 
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
  2 
+<geonames style="MEDIUM">
  3 
+<totalResultsCount>6987</totalResultsCount>
  4 
+<geoname>
  5 
+<name>London</name>
  6 
+<lat>51.5084152563931</lat>
  7 
+<lng>-0.125532746315002</lng>
  8 
+<geonameId>2643743</geonameId>
  9 
+<countryCode>GB</countryCode>
  10 
+<countryName>United Kingdom</countryName>
  11 
+
  12 
+<fcl>P</fcl>
  13 
+<fcode>PPLC</fcode>
  14 
+</geoname>
  15 
+<geoname>
  16 
+<name>London</name>
  17 
+<lat>42.983389283</lat>
  18 
+<lng>-81.233042387</lng>
  19 
+<geonameId>6058560</geonameId>
  20 
+<countryCode>CA</countryCode>
  21 
+<countryName>Canada</countryName>
  22 
+
  23 
+<fcl>P</fcl>
  24 
+<fcode>PPL</fcode>
  25 
+</geoname>
  26 
+<geoname>
  27 
+<name>East London</name>
  28 
+<lat>-33.0152850934643</lat>
  29 
+<lng>27.9116249084473</lng>
  30 
+<geonameId>1006984</geonameId>
  31 
+<countryCode>ZA</countryCode>
  32 
+<countryName>South Africa</countryName>
  33 
+
  34 
+<fcl>P</fcl>
  35 
+<fcode>PPL</fcode>
  36 
+</geoname>
  37 
+<geoname>
  38 
+<name>City</name>
  39 
+<lat>51.5133363996235</lat>
  40 
+<lng>-0.0890064239501953</lng>
  41 
+<geonameId>2643744</geonameId>
  42 
+<countryCode>GB</countryCode>
  43 
+<countryName>United Kingdom</countryName>
  44 
+
  45 
+<fcl>A</fcl>
  46 
+<fcode>ADM2</fcode>
  47 
+</geoname>
  48 
+<geoname>
  49 
+<name>London</name>
  50 
+<lat>37.1289771</lat>
  51 
+<lng>-84.0832646</lng>
  52 
+<geonameId>4298960</geonameId>
  53 
+<countryCode>US</countryCode>
  54 
+<countryName>United States</countryName>
  55 
+
  56 
+<fcl>P</fcl>
  57 
+<fcode>PPL</fcode>
  58 
+</geoname>
  59 
+<geoname>
  60 
+<name>The Tower of London</name>
  61 
+<lat>51.5082349601834</lat>
  62 
+<lng>-0.0763034820556641</lng>
  63 
+<geonameId>6286786</geonameId>
  64 
+<countryCode>GB</countryCode>
  65 
+<countryName>United Kingdom</countryName>
  66 
+
  67 
+<fcl>S</fcl>
  68 
+<fcode>CSTL</fcode>
  69 
+</geoname>
  70 
+<geoname>
  71 
+<name>London Reefs</name>
  72 
+<lat>8.85</lat>
  73 
+<lng>112.5333333</lng>
  74 
+<geonameId>1879967</geonameId>
  75 
+<countryCode>  </countryCode>
  76 
+<countryName>  </countryName>
  77 
+
  78 
+<fcl>U</fcl>
  79 
+<fcode>RFSU</fcode>
  80 
+</geoname>
  81 
+<geoname>
  82 
+<name>Greater London</name>
  83 
+<lat>51.5</lat>
  84 
+<lng>-0.1666667</lng>
  85 
+<geonameId>2648110</geonameId>
  86 
+<countryCode>GB</countryCode>
  87 
+<countryName>United Kingdom</countryName>
  88 
+
  89 
+<fcl>A</fcl>
  90 
+<fcode>ADM2</fcode>
  91 
+</geoname>
  92 
+<geoname>
  93 
+<name>London</name>
  94 
+<lat>46.1666667</lat>
  95 
+<lng>6.0166667</lng>
  96 
+<geonameId>2661811</geonameId>
  97 
+<countryCode>CH</countryCode>
  98 
+<countryName>Switzerland</countryName>
  99 
+
  100 
+<fcl>H</fcl>
  101 
+<fcode>STM</fcode>
  102 
+</geoname>
  103 
+<geoname>
  104 
+<name>London Borough of Islington</name>
  105 
+<lat>51.5333333</lat>
  106 
+<lng>-0.1333333</lng>
  107 
+<geonameId>3333156</geonameId>
  108 
+<countryCode>GB</countryCode>
  109 
+<countryName>United Kingdom</countryName>
  110 
+
  111 
+<fcl>A</fcl>
  112 
+<fcode>ADM2</fcode>
  113 
+</geoname>
  114 
+</geonames>
Txt demos/autocomplete/xml.html
  • View file @ 1382af8
... ... 
@@ -0,0 +1,68 @@
  1 
+<!doctype html>
  2 
+<html>
  3 
+<head>
  4 
+  <title>jQuery UI Autocomplete Remote datasource demo</title>
  5 
+  <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
  6 
+  <script type="text/javascript" src="../../jquery-1.4.js"></script>
  7 
+  <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
  8 
+  <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
  9 
+  <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
  10 
+  <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
  11 
+  <link type="text/css" href="../demos.css" rel="stylesheet" />
  12 
+  <script type="text/javascript">
  13 
+  $(function() {
  14 
+    function log(message) {
  15 
+      $("<div/>").text(message).prependTo("#log");
  16 
+      $("#log").attr("scrollTop", 0);
  17 
+    }
  18 
+    
  19 
+    $.ajax({
  20 
+      url: "london.xml",
  21 
+      dataType: "xml",
  22 
+      success: function(xmlResponse) {
  23 
+        var data = $("geoname", xmlResponse).map(function() {
  24 
+          return {
  25 
+            value: $("name", this).text() + ", " + ($.trim($("countryName", this).text()) || "(unknown country)"),
  26 
+            id: $("geonameId", this).text()
  27 
+          };
  28 
+        }).get();
  29 
+        $("#birds").autocomplete({
  30 
+          source: data,
  31 
+          minLength: 0,
  32 
+          select: function(event, ui) {
  33 
+            log(ui.item ? ("Selected: " + ui.item.value + ", geonameId: " + ui.item.id) : "Nothing selected, input was " + this.value);
  34 
+          }
  35 
+        });
  36 
+      }
  37 
+    })
  38 
+    
  39 
+  });
  40 
+  </script>
  41 
+</head>
  42 
+<body>
  43 
+
  44 
+<div class="demo">
  45 
+
  46 
+<div class="ui-widget">
  47 
+  <label for="birds">London matches: </label>
  48 
+  <input id="birds" />
  49 
+</div>
  50 
+
  51 
+<div class="ui-widget" style="margin-top:2em; font-family:Arial">
  52 
+  Result:
  53 
+  <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
  54 
+</div>
  55 
+
  56 
+</div><!-- End demo -->
  57 
+
  58 
+<div class="demo-description">
  59 
+<p>
  60 
+This demo shows how to retrieve some XML data, parse it using jQuery's methods, then provide it to the autocomplete as the datasource.
  61 
+</p>
  62 
+<p>
  63 
+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.
  64 
+</p>
  65 
+</div><!-- End demo-description -->
  66 
+
  67 
+</body>
  68 
+</html>

0 notes on commit 1382af8

Please log in to comment.
Blog | Support | Training | Contact | API | Status | Twitter | Help | Security
© 2010 GitHub Inc. All rights reserved. | Terms of Service | Privacy Policy
Powered by the Dedicated Servers and
Cloud Computing of Rackspace Hosting®
Dedicated Server