javascriptjqueryangularjsjquery-chosenangular-chosen

Want to add none as value in select multiple


I am using chosen.jquery.js for select field

<select chosen multiple data-placeholder="Select Body Part(s)"  
ng-options="option.Name as option.Name for option in BodyPartList" ng-model="Body_Part">
      <option value="" disabled>Select Body Part(s)</option> 
</select>

But It shows only data-placeholder value in case of no data in model. I want to show "Select Body Part(s)" as a option in list. And user must not select this. Reason is that, I want to add dynamic "Unknown" value in list of Body_Parts. But it not reflect in list.

Same work for select having single selection.


Solution

  • I'm not seeing any problems with your code, as such. Like, I'm trying it and getting the visual behaviour I think you're wanting? Am I missing something?

    enter image description here

    Html just yours with ng-app etc, javascript is:

    var myApp = angular.module('myApp', ['localytics.directives']);
    
    myApp.controller('MyController', function($scope) { 
      $scope.BodyPartList = [
        { Name: "Arm" },
        { Name: "Leg" }
      ];
    
      $scope.Body_Part = [];
    });
    

    Not sure if data-placeholder is actually doing anything.

    Fiddle: http://jsfiddle.net/7187f6d9/

    That said, it's not "working". In the fiddle I put a regular select box alongside the chosen one, and the chosen one doesn't seem to be writing to the ng-model correctly. I'm not sure what's up with that.