forked from fauxparse/bootstrap-floating-labels
/
floating-labels.js
40 lines (33 loc) · 1.39 KB
/
floating-labels.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
.directive('inlineLabel',function () {
return {
restrict: 'EA',
replace: true,
transclude: false,
scope: {
label: '@placeholder',
pos: '@pos'
},
link: function (scope, element, attrs) {
//default
if (!attrs.pos) {
scope.pos = 'top'
}
var parentRow = element.parents('.form-group');
parentRow.addClass('floating-label-form-group');
element.before('<label class="' + scope.pos + '">' + scope.label + '</label>');
parentRow.toggleClass("floating-label-form-group-with-value", !!element.val());
element.bind('paste keyup blur focus', function (event) {
var eventType = event.type;
if (eventType == 'focus') {
parentRow.addClass("floating-label-form-group-with-focus");
}
if (eventType == 'blur') {
parentRow.removeClass("floating-label-form-group-with-focus");
}
if (eventType == 'keyup' || 'paste') {
parentRow.toggleClass("floating-label-form-group-with-value", !!element.val());
}
});
}
}
})