Added option to disable element

Setting the field disabled of an option to true will disable that option, if the option was previously checked it will still stay checked and will not be able to be unchecked.
Implements #239

Author: pkempenaers

pages/javascripts/pages/home/ExampleCtrl.js

@@ -3,7 +3,7 @@
 angular.module('exampleApp').controller('ExampleCtrl', ['$scope', function($scope) {
     $scope.testmodel = [];
     $scope.testdata = [
-		{ id: 1, label: "David"},
+		{ id: 1, label: "David", disabled: true},
 		{ id: 2, label: "Jhon"},
 		{ id: 3, label: "Danny"}];
     $scope.testsettings = {
@@ -246,4 +246,11 @@ angular.module('exampleApp').controller('ExampleCtrl', ['$scope', function($scop
     	enableSearch: true,
 		keyboardControls: true
     };
+		
+		$scope.disabledModel = [];
+    $scope.disabledData = [
+			{ id: 1, label: "David", disabled: true},
+			{ id: 2, label: "Jhon"},
+			{ id: 3, label: "Danny"}
+		];
 }]);

pages/javascripts/pages/home/home.html

@@ -864,6 +864,45 @@ <h3>Code</h3>
 				</div>
 			</div>
 		</uib-accordion-group>
+		<uib-accordion-group heading="Disable Option">
+			<div class="row">
+				<div class="col-xs-12">
+					Setting the field disabled of an option to true will disable that option, if the option was previously
+					checked it will still stay checked and will not be able to be unchecked.
+				</div>
+			</div>
+			<div class="row">
+				<div class="col-xs-12 col-sm-6">
+					<h3>Demo</h3>
+					<div class="well">
+						<div>
+							<div ng-dropdown-multiselect="" options="disabledData" selected-model="disabledModel"></div>
+						</div>
+					</div>
+				</div>
+				<div class="col-xs-12 col-sm-6">
+					<h3>The model:</h3>
+					<pre>{{disabledModel|json}}</pre>
+				</div>
+			</div>
+			<div class="row">
+				<div class="col-md-12">
+					<h3>Code</h3>
+					<div hljs language="javascript">
+// HTML
+<div ng-dropdown-multiselect="" options="disabledData" selected-model="disabledModel"></div>
+
+// JavaScript
+$scope.disabledModel = [];
+$scope.disabledData = [
+	{ id: 1, label: "David", disabled: true},
+	{ id: 2, label: "Jhon"},
+	{ id: 3, label: "Danny"}
+];
+					</div>
+				</div>
+			</div>
+		</uib-accordion-group>
 	</uib-accordion>
 	<h1>Full API Documentation</h1>
 	<h2>Attributes</h2>

pages/stylesheets/stylesheet.css

@@ -402,6 +402,10 @@ footer a:hover {
         padding-right: 0;
         margin-left: 0;
     }
+		
+		a.option[disabled] {
+    	opacity: 0.5;
+		}
 }
 /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
  @media only screen and (min-width: 480px) and (max-width: 767px) {

src/angularjs-dropdown-multiselect.js

@@ -46,7 +46,7 @@ directiveModule.directive('ngDropdownMultiselect', ['$filter', '$document', '$co
                 	template += '<li ng-class="{\'active\': isChecked(getPropertyForObject(option,settings.idProp)) && settings.styleActive}" role="presentation" ng-repeat="option in options | filter:getFilter(input.searchFilter)">';
                 }
 
-                template += '<a ng-keydown="keyDownLink($event)" role="menuitem" class="option" tabindex="-1" ng-click="setSelectedItem(getPropertyForObject(option,settings.idProp), false, true)">';
+                template += '<a ng-keydown="option.disabled || keyDownLink($event)" role="menuitem" class="option" tabindex="-1" ng-click="option.disabled || setSelectedItem(getPropertyForObject(option,settings.idProp), false, true)" ng-disabled="option.disabled">';
 
                 if (checkboxes) {
                     template += '<div class="checkbox"><label><input class="checkboxInput" type="checkbox" ng-click="checkboxClick($event, getPropertyForObject(option,settings.idProp))" ng-checked="isChecked(getPropertyForObject(option,settings.idProp))" /> <span mf-dropdown-static-include="{{settings.template}}"></div></label></span></a>';