Skip to content

Commit 8d87d06

Browse files
rdworthrdworth
committed
eol-style and mime-type
1 parent 2725bf3 commit 8d87d06

File tree

2 files changed

+163
-163
lines changed

2 files changed

+163
-163
lines changed

‎demos/autocomplete/categories.html

Lines changed: 94 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,94 +1,94 @@
1-
<!DOCTYPE html>
2-
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<title>jQuery UI Autocomplete Custom Data Demo</title>
6-
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
7-
<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
8-
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
9-
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
10-
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
11-
<script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
12-
<link type="text/css" href="../demos.css" rel="stylesheet" />
13-
<style type="text/css">
14-
.ui-autocomplete-category {
15-
font-weight:bold;
16-
padding:.2em .4em;
17-
margin:.8em 0 .2em;
18-
line-height:1.5;
19-
}
20-
</style>
21-
<script type="text/javascript">
22-
$.extend( $.ui.menu.prototype, {
23-
next: function() {
24-
this.move("next", ".ui-menu-item:first");
25-
},
26-
27-
previous: function() {
28-
this.move("prev", ".ui-menu-item:last");
29-
},
30-
31-
move: function(direction, edge) {
32-
if (!this.active) {
33-
this.activate(this.element.children(edge));
34-
return;
35-
}
36-
var next = this.active[direction + "All"]('.ui-menu-item').eq( 0 );
37-
if (next.length) {
38-
this.activate(next);
39-
} else {
40-
this.activate(this.element.children(edge));
41-
}
42-
}
43-
});
44-
45-
$.widget("custom.catcomplete", $.ui.autocomplete, {
46-
_renderMenu: function( ul, items ) {
47-
var self = this,
48-
currentCategory = "";
49-
$.each( items, function( index, item ) {
50-
if ( item.category != currentCategory ) {
51-
ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
52-
currentCategory = item.category;
53-
}
54-
self._renderItem( ul, item );
55-
});
56-
}
57-
});
58-
</script>
59-
<script type="text/javascript">
60-
$(function() {
61-
var data = [
62-
{ label: "anders", category: "" },
63-
{ label: "andreas", category: "" },
64-
{ label: "antal", category: "" },
65-
{ label: "annhhx10", category: "Products" },
66-
{ label: "annk K12", category: "Products" },
67-
{ label: "annttop C13", category: "Products" },
68-
{ label: "anders andersson", category: "People" },
69-
{ label: "andreas andersson", category: "People" },
70-
{ label: "andreas johnson", category: "People" }
71-
];
72-
73-
$('#search').catcomplete({
74-
delay: 0,
75-
source: data
76-
});
77-
});
78-
</script>
79-
</head>
80-
<body>
81-
82-
<div class="demo">
83-
<label for="search">Search: </label>
84-
<input id="search" />
85-
</div><!-- End demo -->
86-
87-
<div class="demo-description">
88-
<p>
89-
A categorized search result. Try typing "a" or "n".
90-
</p>
91-
</div><!-- End demo-description -->
92-
93-
</body>
94-
</html>
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>jQuery UI Autocomplete Custom Data Demo</title>
6+
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
7+
<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
8+
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
9+
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
10+
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
11+
<script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
12+
<link type="text/css" href="../demos.css" rel="stylesheet" />
13+
<style type="text/css">
14+
.ui-autocomplete-category {
15+
font-weight:bold;
16+
padding:.2em .4em;
17+
margin:.8em 0 .2em;
18+
line-height:1.5;
19+
}
20+
</style>
21+
<script type="text/javascript">
22+
$.extend( $.ui.menu.prototype, {
23+
next: function() {
24+
this.move("next", ".ui-menu-item:first");
25+
},
26+
27+
previous: function() {
28+
this.move("prev", ".ui-menu-item:last");
29+
},
30+
31+
move: function(direction, edge) {
32+
if (!this.active) {
33+
this.activate(this.element.children(edge));
34+
return;
35+
}
36+
var next = this.active[direction + "All"]('.ui-menu-item').eq( 0 );
37+
if (next.length) {
38+
this.activate(next);
39+
} else {
40+
this.activate(this.element.children(edge));
41+
}
42+
}
43+
});
44+
45+
$.widget("custom.catcomplete", $.ui.autocomplete, {
46+
_renderMenu: function( ul, items ) {
47+
var self = this,
48+
currentCategory = "";
49+
$.each( items, function( index, item ) {
50+
if ( item.category != currentCategory ) {
51+
ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
52+
currentCategory = item.category;
53+
}
54+
self._renderItem( ul, item );
55+
});
56+
}
57+
});
58+
</script>
59+
<script type="text/javascript">
60+
$(function() {
61+
var data = [
62+
{ label: "anders", category: "" },
63+
{ label: "andreas", category: "" },
64+
{ label: "antal", category: "" },
65+
{ label: "annhhx10", category: "Products" },
66+
{ label: "annk K12", category: "Products" },
67+
{ label: "annttop C13", category: "Products" },
68+
{ label: "anders andersson", category: "People" },
69+
{ label: "andreas andersson", category: "People" },
70+
{ label: "andreas johnson", category: "People" }
71+
];
72+
73+
$('#search').catcomplete({
74+
delay: 0,
75+
source: data
76+
});
77+
});
78+
</script>
79+
</head>
80+
<body>
81+
82+
<div class="demo">
83+
<label for="search">Search: </label>
84+
<input id="search" />
85+
</div><!-- End demo -->
86+
87+
<div class="demo-description">
88+
<p>
89+
A categorized search result. Try typing "a" or "n".
90+
</p>
91+
</div><!-- End demo-description -->
92+
93+
</body>
94+
</html>

‎demos/autocomplete/xml.html

Lines changed: 69 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,69 @@
1-
<!DOCTYPE html>
2-
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<title>jQuery UI Autocomplete Remote datasource demo</title>
6-
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
7-
<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
8-
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
9-
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
10-
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
11-
<script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
12-
<link type="text/css" href="../demos.css" rel="stylesheet" />
13-
<script type="text/javascript">
14-
$(function() {
15-
function log(message) {
16-
$("<div/>").text(message).prependTo("#log");
17-
$("#log").attr("scrollTop", 0);
18-
}
19-
20-
$.ajax({
21-
url: "london.xml",
22-
dataType: "xml",
23-
success: function(xmlResponse) {
24-
var data = $("geoname", xmlResponse).map(function() {
25-
return {
26-
value: $("name", this).text() + ", " + ($.trim($("countryName", this).text()) || "(unknown country)"),
27-
id: $("geonameId", this).text()
28-
};
29-
}).get();
30-
$("#birds").autocomplete({
31-
source: data,
32-
minLength: 0,
33-
select: function(event, ui) {
34-
log(ui.item ? ("Selected: " + ui.item.value + ", geonameId: " + ui.item.id) : "Nothing selected, input was " + this.value);
35-
}
36-
});
37-
}
38-
})
39-
40-
});
41-
</script>
42-
</head>
43-
<body>
44-
45-
<div class="demo">
46-
47-
<div class="ui-widget">
48-
<label for="birds">London matches: </label>
49-
<input id="birds" />
50-
</div>
51-
52-
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
53-
Result:
54-
<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
55-
</div>
56-
57-
</div><!-- End demo -->
58-
59-
<div class="demo-description">
60-
<p>
61-
This demo shows how to retrieve some XML data, parse it using jQuery's methods, then provide it to the autocomplete as the datasource.
62-
</p>
63-
<p>
64-
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.
65-
</p>
66-
</div><!-- End demo-description -->
67-
68-
</body>
69-
</html>
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>jQuery UI Autocomplete Remote datasource demo</title>
6+
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
7+
<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
8+
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
9+
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
10+
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
11+
<script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
12+
<link type="text/css" href="../demos.css" rel="stylesheet" />
13+
<script type="text/javascript">
14+
$(function() {
15+
function log(message) {
16+
$("<div/>").text(message).prependTo("#log");
17+
$("#log").attr("scrollTop", 0);
18+
}
19+
20+
$.ajax({
21+
url: "london.xml",
22+
dataType: "xml",
23+
success: function(xmlResponse) {
24+
var data = $("geoname", xmlResponse).map(function() {
25+
return {
26+
value: $("name", this).text() + ", " + ($.trim($("countryName", this).text()) || "(unknown country)"),
27+
id: $("geonameId", this).text()
28+
};
29+
}).get();
30+
$("#birds").autocomplete({
31+
source: data,
32+
minLength: 0,
33+
select: function(event, ui) {
34+
log(ui.item ? ("Selected: " + ui.item.value + ", geonameId: " + ui.item.id) : "Nothing selected, input was " + this.value);
35+
}
36+
});
37+
}
38+
})
39+
40+
});
41+
</script>
42+
</head>
43+
<body>
44+
45+
<div class="demo">
46+
47+
<div class="ui-widget">
48+
<label for="birds">London matches: </label>
49+
<input id="birds" />
50+
</div>
51+
52+
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
53+
Result:
54+
<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
55+
</div>
56+
57+
</div><!-- End demo -->
58+
59+
<div class="demo-description">
60+
<p>
61+
This demo shows how to retrieve some XML data, parse it using jQuery's methods, then provide it to the autocomplete as the datasource.
62+
</p>
63+
<p>
64+
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.
65+
</p>
66+
</div><!-- End demo-description -->
67+
68+
</body>
69+
</html>

0 commit comments

Comments
 (0)