Skip to content

Commit 10e1d05

Browse files
TravisCITravisCI
committed
docs(*): new deploy (angular-ui/ui-select@e1ec70e)
1 parent 75b83ce commit 10e1d05

File tree

8 files changed

+413
-161
lines changed

8 files changed

+413
-161
lines changed

‎demo-header-and-footer.html

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
<!DOCTYPE html>
2+
<html lang="en" ng-app="demo">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>AngularJS ui-select</title>
6+
7+
<!--
8+
IE8 support, see AngularJS Internet Explorer Compatibility https://docs.angularjs.org/guide/ie
9+
For Firefox 3.6, you will also need to include jQuery and ECMAScript 5 shim
10+
-->
11+
<!--[if lt IE 9]>
12+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
13+
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/2.2.0/es5-shim.js"></script>
14+
<script>
15+
document.createElement('ui-select');
16+
document.createElement('ui-select-match');
17+
document.createElement('ui-select-choices');
18+
</script>
19+
<![endif]-->
20+
21+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
22+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-sanitize.js"></script>
23+
24+
<!-- ui-select files -->
25+
<script src="./dist/select.js"></script>
26+
<link rel="stylesheet" href="./dist/select.css">
27+
28+
<script src="./assets/demo.js"></script>
29+
30+
<!-- themes -->
31+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.css">
32+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.5/select2.css">
33+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.8.5/css/selectize.default.css">
34+
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.8.5/css/selectize.bootstrap2.css"> -->
35+
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.8.5/css/selectize.bootstrap3.css">-->
36+
37+
<style>
38+
body {
39+
padding: 15px;
40+
}
41+
42+
.select2 > .select2-choice.ui-select-match {
43+
/* Because of the inclusion of Bootstrap */
44+
height: 29px;
45+
}
46+
47+
.selectize-control > .selectize-dropdown {
48+
top: 36px;
49+
}
50+
/* Some additional styling to demonstrate that append-to-body helps achieve the proper z-index layering. */
51+
.select-box {
52+
background: #fff;
53+
position: relative;
54+
z-index: 1;
55+
}
56+
.alert-info.positioned {
57+
margin-top: 1em;
58+
position: relative;
59+
z-index: 10000; /* The select2 dropdown has a z-index of 9999 */
60+
}
61+
</style>
62+
</head>
63+
64+
<body class="ng-cloak" ng-controller="DemoCtrl as ctrl">
65+
<h3>Basic Header and Footer</h3>
66+
<button class="btn btn-default btn-xs" ng-click="ctrl.enable()">Enable ui-select</button>
67+
<button class="btn btn-default btn-xs" ng-click="ctrl.disable()">Disable ui-select</button>
68+
<button class="btn btn-default btn-xs" ng-click="ctrl.clear()">Clear ng-model</button>
69+
70+
<h3>Bootstrap theme <small>(remote data source)</small></h3>
71+
<p>Selected: {{ctrl.address.selected.formatted_address}}</p>
72+
<ui-select ng-model="ctrl.address.selected"
73+
theme="bootstrap"
74+
ng-disabled="ctrl.disabled"
75+
reset-search-input="false"
76+
style="width: 300px;"
77+
title="Choose an address">
78+
<ui-select-match placeholder="Enter an address...">{{$select.selected.formatted_address}}</ui-select-match>
79+
<ui-select-header>Header text</ui-select-header>
80+
<ui-select-choices repeat="address in ctrl.addresses track by $index"
81+
refresh="ctrl.refreshAddresses($select.search)"
82+
refresh-delay="0">
83+
<div ng-bind-html="address.formatted_address | highlight: $select.search"></div>
84+
</ui-select-choices>
85+
<ui-select-footer>Footer text</ui-select-footer>
86+
</ui-select>
87+
88+
<h3>Select2 theme</h3>
89+
<p>Selected: {{ctrl.person.selected}}</p>
90+
<ui-select ng-model="ctrl.person.selected" theme="select2" ng-disabled="ctrl.disabled" style="min-width: 300px;" title="Choose a person">
91+
<ui-select-match placeholder="Select a person in the list or search his name/age...">{{$select.selected.name}}</ui-select-match>
92+
<ui-select-header>Header text</ui-select-header>
93+
<ui-select-choices repeat="person in ctrl.people | propsFilter: {name: $select.search, age: $select.search}">
94+
<div ng-bind-html="person.name | highlight: $select.search"></div>
95+
<small>
96+
email: {{person.email}}
97+
age: <span ng-bind-html="''+person.age | highlight: $select.search"></span>
98+
</small>
99+
</ui-select-choices>
100+
<ui-select-footer>Footer text</ui-select-footer>
101+
</ui-select>
102+
103+
<h3>Selectize theme</h3>
104+
<p>Selected: {{ctrl.country.selected}}</p>
105+
<ui-select ng-model="ctrl.country.selected" theme="selectize" ng-disabled="ctrl.disabled" style="width: 300px;" title="Choose a country">
106+
<ui-select-match placeholder="Select or search a country in the list...">{{$select.selected.name}}</ui-select-match>
107+
<ui-select-header>Header text</ui-select-header>
108+
<ui-select-choices repeat="country in ctrl.countries | filter: $select.search">
109+
<span ng-bind-html="country.name | highlight: $select.search"></span>
110+
<small ng-bind-html="country.code | highlight: $select.search"></small>
111+
</ui-select-choices>
112+
<ui-select-footer>Footer text</ui-select-footer>
113+
</ui-select>
114+
</body>
115+
</html>

0 commit comments

Comments
 (0)