Skip to content
This repository was archived by the owner on Sep 8, 2020. It is now read-only.

Commit f275977

Browse files
committed
Html attribute based event handling
Event handle on html attribute tag. Readme.md updated.
1 parent 6cfe4e1 commit f275977

File tree

2 files changed

+62
-5
lines changed

2 files changed

+62
-5
lines changed

README.md

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,42 @@ To provide a solution/workaround (till jquery.ui.sortable.refresh() also tests t
104104
</ul>
105105
```
106106

107+
108+
#### Attributes For Event Handling
109+
110+
To handle events with html bindings just define any expression to listed event attributes.
111+
If you defined an attribute for this events and defined callback function in sortableOptions at the same time attribute based callback will be selected.
112+
If attribute based callback expression is not filled then sortableOption based callback function will be selected.
113+
114+
* **ui-sortable-receive**
115+
* **ui-sortable-remove**
116+
* **ui-sortable-start**
117+
* **ui-sortable-stop**
118+
* **ui-sortable-update**
119+
120+
121+
122+
Expression works on update event.
123+
```html
124+
<ul ui-sortable ng-model="items" ui-sortable-update="expression" >
125+
<li ng-repeat="item in items">{{ item }}</li>
126+
</ul>
127+
```
128+
129+
130+
callBackFunction2 works on update event.
131+
```js
132+
$scope.sortableOptions = {
133+
'update': callBackFunction
134+
};
135+
```
136+
```html
137+
<ul ui-sortable="sortableOptions" ng-model="items" ui-sortable-update="callBackFunction2()" >
138+
<li ng-repeat="item in items">{{ item }}</li>
139+
</ul>
140+
```
141+
142+
107143
**OR**
108144

109145
```js

src/sortable.js

Lines changed: 26 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,13 @@ angular.module('ui.sortable', [])
1616
return {
1717
require: '?ngModel',
1818
scope: {
19-
ngModel: '=',
20-
uiSortable: '='
19+
ngModel: '=',
20+
uiSortable: '=',
21+
receive :'&uiSortableReceive',//Expression bindings from html.
22+
remove :'&uiSortableRemove',
23+
start :'&uiSortableStart',
24+
stop :'&uiSortableStop',
25+
update :'&uiSortableUpdate'
2126
},
2227
link: function(scope, element, attrs, ngModel) {
2328
var savedNodes;
@@ -125,9 +130,25 @@ angular.module('ui.sortable', [])
125130
opts[key] = patchSortableOption(key, value);
126131
return;
127132
}
128-
129-
value = patchSortableOption(key, value);
130-
133+
134+
135+
/*
136+
* If user defines ui-sortable-callback for @key and callback based option at the same time the html based ui-sortable-callback expression will be selected. (Overridden)
137+
* If user defined ui-sortable-callback for @key but callback expression is empty then option based @key callback will be selected.
138+
* If user not defines a option for @key callback then html based ui-sortable-callback will be just selected.
139+
* If user just defines option for @key callback then it will be attached.
140+
* */
141+
var attrKey = 'uiSortable'+key.substring(0,1).toUpperCase()+key.substring(1);
142+
if(scope[key]!=undefined && scope[key] instanceof Function && attrs[attrKey] != undefined && attrs[attrKey].length > 0)
143+
{
144+
value = patchSortableOption(key, scope[key]);
145+
}
146+
else
147+
{
148+
value = patchSortableOption(key, value);
149+
}
150+
151+
131152
if (!optsDiff) {
132153
optsDiff = {};
133154
}

0 commit comments

Comments
 (0)