Skip to content

Commit c45d63b

Browse files
author
Sandro Tajè
committed
added isolation to form so parent form won't be affected by neItem
Form invalidation
1 parent dfc8df4 commit c45d63b

7 files changed

+8099
-57
lines changed

.gitignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,5 @@ bower_components/
22
node_modules/
33
angular-uikit.iml
44
.idea/
5-
test.json
5+
test.json
6+
debug.log

dist/angular-uikit.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/index.html

+54-52
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22

33
<head>
44
<title>Angular UIkit showcase</title>
5-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/uikit.min.css"/>
6-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/autocomplete.min.css"/>
7-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/form-select.min.css"/>
8-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/sortable.min.css"/>
9-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/form-advanced.min.css"/>
10-
<link rel="stylesheet" href="angular-uikit.min.css"/>
5+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/uikit.min.css" />
6+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/autocomplete.min.css" />
7+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/form-select.min.css" />
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/sortable.min.css" />
9+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/form-advanced.min.css" />
10+
<link rel="stylesheet" href="angular-uikit.min.css" />
1111

1212
<style>
1313
.alert-class {
@@ -20,51 +20,53 @@
2020
<body data-ng-controller="MainController as vm">
2121

2222

23-
<article class="uk-article">
24-
<h1 class="uk-article-title">Autocomplete</h1>
25-
<input data-uk-ng-autocomplete data-ng-model="vm.selected" data-uk-on-select="vm.autocompOnSelect($selectedItem)" data-uk-label="'userId'" data-uk-source-path="'https://jsonplaceholder.typicode.com/posts'">
26-
<button class="uk-button" data-ng-click="vm.source = [{id:1, pippo:'test1'},{id:43, pippo:'asdasd'},{id:42, pippo:'asdasd'}];">Change source</button>
27-
Selected item: {{vm.selected}}
23+
<article class="uk-article">
24+
<h1 class="uk-article-title">Autocomplete</h1>
25+
<input data-uk-ng-autocomplete data-ng-model="vm.selected" data-uk-on-select="vm.autocompOnSelect($selectedItem)" data-uk-label="'userId'"
26+
data-uk-source-path="'https://jsonplaceholder.typicode.com/posts'">
27+
<button class="uk-button" data-ng-click="vm.source = [{id:1, pippo:'test1'},{id:43, pippo:'asdasd'},{id:42, pippo:'asdasd'}];">Change source</button>
28+
Selected item: {{vm.selected}}
2829

29-
</article>
30+
</article>
3031

31-
<article class="uk-article">
32-
<h1 class="uk-article-title">Calendar</h1>
33-
<uk-ng-calendar data-get-events-by-date="vm.getEventsByDate($startDate, $endDate)" data-on-event-selected="vm.onEventSelected($event)"></uk-ng-calendar>
34-
</article>
32+
<article class="uk-article">
33+
<h1 class="uk-article-title">Calendar</h1>
34+
<uk-ng-calendar data-get-events-by-date="vm.getEventsByDate($startDate, $endDate)" data-on-event-selected="vm.onEventSelected($event)"></uk-ng-calendar>
35+
</article>
3536

36-
<article class="uk-article">
37-
<h1 class="uk-article-title">Sortable</h1>
38-
<div class="uk-grid uk-grid-match uk-sortable" data-uk-ng-sortable="{handleClass: 'uk-sortable-handle'}">
39-
<div data-id="{{$index}}" data-uk-ng-sortable-item="p" data-ng-repeat="p in vm.sortList | orderBy: 'order'" data-uk-grid-margin>
40-
<i data-ng-if="!conf.readonly" class="uk-icon-bars uk-text-success uk-sortable-handle"></i>Ciao
37+
<article class="uk-article">
38+
<h1 class="uk-article-title">Sortable</h1>
39+
<div class="uk-grid uk-grid-match uk-sortable" data-uk-ng-sortable="{handleClass: 'uk-sortable-handle'}">
40+
<div data-id="{{$index}}" data-uk-ng-sortable-item="p" data-ng-repeat="p in vm.sortList | orderBy: 'order'" data-uk-grid-margin>
41+
<i data-ng-if="!conf.readonly" class="uk-icon-bars uk-text-success uk-sortable-handle"></i>Ciao
42+
</div>
4143
</div>
42-
</div>
43-
</article>
44-
45-
<article class="uk-article">
46-
<h1 class="uk-article-title">JSON Table Form</h1>
47-
<uk-ng-json-table-form model="vm.jsonTableModel" structure="vm.structure" can-reorder="true" submit-on-enter="true" read-only="true"></uk-ng-json-table-form>
48-
{{vm.jsonTableModel | json}}
49-
</article>
50-
51-
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
52-
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
53-
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/uikit.min.js"></script>
54-
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/autocomplete.min.js"></script>
55-
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/sortable.min.js"></script>
56-
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"></script>
57-
58-
<script src="angular-uikit.min.js"></script>
59-
<script>
60-
angular.module('angularUIkitShowcase', ['angularUikit'])
44+
</article>
45+
46+
<article class="uk-article">
47+
<h1 class="uk-article-title">JSON Table Form</h1>
48+
<uk-ng-json-table-form model="vm.jsonTableModel" structure="vm.structure" can-reorder="true" submit-on-enter="true" read-only="true"></uk-ng-json-table-form>
49+
50+
{{vm.jsonTableModel | json}}
51+
</article>
52+
53+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
54+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
55+
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/uikit.min.js"></script>
56+
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/autocomplete.min.js"></script>
57+
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/sortable.min.js"></script>
58+
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"></script>
59+
60+
<script src="angular-uikit.min.js"></script>
61+
<script>
62+
angular.module('angularUIkitShowcase', ['angularUikit'])
6163
.controller('MainController', function ($q, $timeout) {
6264
var vm = this;
6365

64-
vm.selected = {"userId":2,"id":12,"title":"in quibusdam tempore odit est dolorem","body":"itaque id aut magnam\npraesentium quia et ea odit et ea voluptas et\nsapiente quia nihil amet occaecati quia id voluptatem\nincidunt ea est distinctio odio"};
66+
vm.selected = { "userId": 2, "id": 12, "title": "in quibusdam tempore odit est dolorem", "body": "itaque id aut magnam\npraesentium quia et ea odit et ea voluptas et\nsapiente quia nihil amet occaecati quia id voluptatem\nincidunt ea est distinctio odio" };
6567
//vm.source = ['test1', 'test2', 'test3'];
6668

67-
vm.source = [{id:1, pippo:'test1'},{id:56, pippo:'test2'},{id:123, pippo:'test3'}];
69+
vm.source = [{ id: 1, pippo: 'test1' }, { id: 56, pippo: 'test2' }, { id: 123, pippo: 'test3' }];
6870

6971

7072
vm.sortList = [{
@@ -95,8 +97,8 @@ <h1 class="uk-article-title">JSON Table Form</h1>
9597
label: "Units"
9698
},
9799
priority: 1,
98-
processRecipeProducts:[
99-
{dosage: "asdas"}
100+
processRecipeProducts: [
101+
{ dosage: "asdas" }
100102
]
101103
}, {
102104
name: "ciao3",
@@ -115,21 +117,21 @@ <h1 class="uk-article-title">JSON Table Form</h1>
115117
"label": "Image",
116118
"property": "thumbnail",
117119
"type": "image",
118-
"image":{
119-
"interpolate":{
120-
"base":"https://getuikit.com/v2/docs/images/placeholder_DIMENSIONE.svg",
121-
"value":"DIMENSIONE"
120+
"image": {
121+
"interpolate": {
122+
"base": "https://getuikit.com/v2/docs/images/placeholder_DIMENSIONE.svg",
123+
"value": "DIMENSIONE"
122124
},
123-
"maxWidth":"100",
124-
"maxHeight":"100"
125+
"maxWidth": "100",
126+
"maxHeight": "100"
125127
}
126128
},
127129
{
128130
"icon": "sort-numeric-asc",
129131
"label": "sequence",
130132
"property": "sequence",
131133
"type": "sequence"
132-
},{
134+
}, {
133135
"label": "Name",
134136
"property": "name",
135137
"type": "text",
@@ -238,7 +240,7 @@ <h1 class="uk-article-title">JSON Table Form</h1>
238240
};
239241

240242
})
241-
</script>
243+
</script>
242244

243245

244246
</body>

0 commit comments

Comments
 (0)