CODEWITHSUNDEEP
javascriptangularjsdirectivebootstrap-multiselect
Deadpool
Deadpool

Reputation: 8240

Multiselect Plugin - AngularJs - Not working properly

I am using following 'MultiSelect' plugin for Angular.js. I think I am using the code properly, still I am only getting errors on Webpage instead of any dropdowns.

Plugin Used:

http://dotansimha.github.io/angularjs-dropdown-multiselect/#/

HTML:

<html>
<head>
    <!-- CSS files --> 
    <link rel="stylesheet" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"> 
    <!-- Script files --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.1.2/ui-bootstrap-tpls.min.js"></script>
    <script src="angularjs-dropdown-multiselect.min.js"></script> 
</head>
<body ng-app="myApp" ng-controller="myCtrl"> 
<div ng-dropdown-multiselect="" options="listOptions" selected-model="list"></div>
<script>
//module declaration
var app = angular.module('myApp',['ui.bootstrap','angularjs-dropdown-multiselect']);
//controller declaration
app.controller('myCtrl',function($scope){
    $scope.list = []; 
    $scope.listOptions = [ 
        {id: 1, label: "David"}, 
        {id: 2, label: "Jhon"}, 
        {id: 3, label: "Danny"}
    ];
});
</script> 
</body> 
</html>

Error:

enter image description here

Can someone help me out telling where am I wrong?

Upvotes: 2

Views: 1637

Answers (2)

Rahul
Rahul

Reputation: 387

I tried this and its working for me

Replace line no 180 angularjs-dropdown-multiselect.js with below code 

 if ($scope.settings.dynamicTitle && $scope.selectedModel && ($scope.selectedModel.length > 0 || (angular.isObject($scope.selectedModel) && _.keys($scope.selectedModel).length > 0))) {

Credits https://github.com/dotansimha/angularjs-dropdown-multiselect/pull/60/files

Include following dependency as recommenced by library https://github.com/dotansimha/angularjs-dropdown-multiselect#dependencies

Upvotes: 1

Mahantesh Kumbar
Mahantesh Kumbar

Reputation: 255

Dependencies:

AngularJS >= 1.2, Lodash >= 2, Bootstrap >= 3.0

Note: Make sure to add lodash.js to your project, and make sure you use the regulate version of Lodash (NOT lodash.underscore or lodash.compat

Add the lodash CDN before loading angularjs-dropdown-multiselect:

    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.5.1/lodash.js"></script>
    <script src="angularjs-dropdown-multiselect.min.js"></script>

Upvotes: 4

Related Questions