inmagik / ionic-modal-select

Modal select for Ionic Framework
https://inmagik.github.io/ionic-modal-select
MIT License
174 stars 70 forks source link

Multiple checked options #79

Open kim-tempus opened 7 years ago

kim-tempus commented 7 years ago

Hey.

I am using multiple-options. Is there a way to pre-set/check options (option.checked="true")?

User will pick som options, save selected data, and then late view the list again with the saved data already selected. (I only save the value, not the object/name. So I rebuild the list with .checked=true myself).

maniolek commented 7 years ago

I can join to @kim-tempus's request. That kind of feature would be really helpful.

bianchimro commented 7 years ago

hi @kim-tempus , pre-setting values you want to be selected on your bound ng-model doesn't work for you?

fauzie commented 7 years ago

+1 for this.

My ng-model current value:

["mobile", "online", "offline"]

My predefined options attribute:

$scope.userOptions = [
    { value: 'offline', label: 'Offline User' },
    { value: 'online', label: 'Online User' },
    { value: 'mobile', label: 'Mobile User' },
    { value: 'socials', label: 'Social Media User' }
  ];
mmaask commented 7 years ago

+1. I would expect that the above example works. When the modal is opened, nothing is checked unfortunately, even though the model is populated and option property specified.

anaBellona commented 7 years ago

@kim-tempus can you please tell us how you solved your problem, how did you rebuild the list with .checked=true I'm trying to modify the example in the demo given in order to use the multiple option but no success so far. Is this know limitation ? Here is the demo, modified the first searchable example into multiple select with predefined model just to check it out and point out if i'm missing something http://codepen.io/anaBellona/pen/mmLdbJ?editors=101

eamers commented 7 years ago

+1 for me as well. Have tried updating the ng-model after the page is loaded as well and that also doesn't work :(

kotromeo commented 7 years ago

+1

kotromeo commented 7 years ago

i think there could be simple code fix to make values selected depend on model. this code example helpm me to make all values checked http://take.ms/XSg8q

klodha commented 7 years ago

Encountered this issue and after lot of debugging finally found this issue.

Based on @kotromeo comment, I found the exact location where I can put missing code, and following is what I put. Of course, it hard coded for my case assumes that all options are Objects and each object has ID field which in common. Someone may take this approach and provide a proper fix, so just sharing here.

function initialOptionsSetup(nv) {
    nv = nv || [];
    if (!multiple) 
    {
        allOptions = angular.copy(nv);
        scope.options = angular.copy(nv);
    } 
    else 
    {
        allOptions = nv.map(function (item, idx) {
            return [idx, angular.copy(item)];
        });

        //This is to get values for ng-model 
        //and mark them checked. passed data must be OBJECT with ID being key
        //for this snippet to work  @KML@
        var presetValues = ngModelController.$viewValue;

        angular.forEach(allOptions, function(option){
            for(var i = 0; i < presetValues.length; i++)
            {
                if(presetValues[i].id == option[1].id)
                {
                    scope.isChecked[option[0]] = true;
                    break;
                }
            }
        });
        scope.options = angular.copy(allOptions);
        scope.setValues();
    }
}
masrooranwer commented 6 years ago

@klodha Thanks for missing code. this fixed works for me