disabling select options on the fly, two approaches

[Matt Ruby]

I've been working on this issue for a few days now.  I have things almost working. 

Not using ng-options, I can get the select options properly disabling as other search values are changed.  The issues is, when you click on a cabinet I set search.height and search.width and Angular will add an empty <option value="? string:65 ?"></option>.  Angular will also set the correct option as being selected.  I can't seem to figure out a way to eliminate the empty option.

http://plnkr.co/edit/FFyZFPR8uxYfnI5R4I4K?p=preview

Using ng-options and optionsDisabled from: https://github.com/angular/angular.js/issues/638

This also works pretty well, however, select options are only disabled when I change the select.  So in order for a height to disable, I have to check the height to something other than the blank option.  In addition, I can't seem to set the first option to "-" without breaking the search filter.  Is there a way to have the select options re-render when a search variable changes?  I think that would solve the main issue with this solution. 

http://plnkr.co/edit/XDD8Qcu8YWV5txHr3bme?p=preview

If you can't tell, this is making me a little crazy.

Thanks for your help in advance!

-Ruby

[Clint Checketts]

Matt,

This might be a bit extreme, but you might consider creating your own directive that generates the selects and options manually.

The extra <option> is being generate by the built in 'select' directive. So I'm not sure how you could work around that, short of a custom directive.

-Clint

-Ruby

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Matt Ruby]

OK, that's pretty extreme.  But, I'm an extreme kinda guy.  Let's hope that the build in select directive is well commented :-)

I'll post back if I ever get that built and working.

-Ruby

[Clint Checketts]

Oh I'm not recommending you re-implement the select directive. I just meant create a directive that would generate the select and options html for you and set it into the elem.html()

-Clint

[Matt Ruby]

Now I'm confused (OK, more confused :-).  Would the select ng-model still be tied to search?  Should I just burn out the select and options without angular and set the select ng-model="search.whatever"?  I'll try that. 

Should I be using Angular for this at all? 

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/_tsduBxc6G4/unsubscribe?hl=en-US.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.

To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

--
-Matt Ruby-
matt...@gmail.com

[Matt Ruby]

OK, how's this for extreme!  http://plnkr.co/edit/FFyZFPR8uxYfnI5R4I4K?p=preview

I've altered a few things in angular.  First, select is now looking for an attribute: ng-disable-blank-option-add

If that's been set, the Single function ngModelCtrl.$render will not call renderUnknownOption.  Everything works well now.  The fun starts on lines:  14364 and 14404 in angular_mod.js

I know I can't be the only person to hit this issue.  I'm too green in Angular to say that this should be added to the core. 

Thanks for your suggestion.

-Ruby

[Clint Checketts]

Matt,,

Sorry for entangling this further.  Here is a preliminary idea: http://plnkr.co/edit/GUzSrK218VUG2RttxFm5?p=preview, I'll think on this during lunch to see how we can keep this sane.

App.directive('cabinetSearchSelect', function(orderByFilter,uniqueFilter){

  return {

    scope: {

      selected: '=',

      options: '=',

    },

    template: '<select ng-model="selected" >'+

              '<option ng-repeat="o in filteredOptions" value="{{o[prop]}}">{{o[prop]}}</option>'+

              '</select>',

    link: function(scope, elem, attr){

      scope.prop = attr.prop;

      

      scope.filteredOptions = orderByFilter(scope.options,scope.prop)

      scope.filteredOptions = uniqueFilter(scope.options,scope.prop)

      

      console.log(scope.prop);

    }

  };

})

-Clint

[Clint Checketts]

Oh wow, that was an epic change in the angular_mod file (not the change, but the gumption ;)

Directives can hook into the ngModel controller and affect the $renderer. This is stretching my Angular knowledge, but I think we could write a custom directive that does the things you modded into Angular.

-Clint

[Matt Ruby]

Haha!  I've been running on not much more than gumption for a few days now!  Thanks for your help.

[amal horchi]

Hi , please can you help me . Series are duplicated , i want to disable selection after choosing an option . 

http://41.231.36.249/SIRWeb/Graphiques/gouvernorats/Demographie/1-population.html