How to use setVal method for initiaite picker with JSON init

Select pickers & dropdowns
1

Hi.
I use “Select” Dropdown. I populate it with JSON call for a Multiple Select.
Now I want, on the load of the page, have some selected default values already selected in the picker.
I used the defaultSelection configuration, so in the dropdown i can see my default value selected, but visually i don"t see in the input component my default value. I think I must use “setVal()” method, but it don"t work. Can You help me, and tell me what I forget or what i did wrong ?

Extract of JSON
[{“value”:“8”,“text”:“Abarth”},{“value”:“12”,“text”:“AC”},{“value”:“24”,“text”:“Aixam”},{“value”:“6”,“text”:“Alfa Romeo”}]

    var mark =  $("#inputma").mobiscroll().select({
    selectMultiple: true,
    filter: true,
    itemHeight: 30,
    defaultSelection:["8","12","24"],
    buttons: ['cancel'],
display: 'anchored',
touchUi: false,       
    onInit: function(event,inst){
        $("#identma").val("8,12");
    },
}).mobiscroll('getInst');
$.getJSON('/json/marque.json', function (resp) {
    mark.setOptions({ data: resp });
});

In 1) Image what I have, and in 2) what I want (on page loading, i have the value in the GET superglobals)

ssq
ssq850×488 15.1 KB

2

Hello @Greg_CHATEAU :wave:

To make the select component select a value by default, you will need to add that value to the data array. For example:

$('#myinput').val('8, 12');
$('#myinput').mobiscroll().select({
  selectMultiple: true,
  data: [
    { value: '8', text: 'Default1' },
    { value: '12', text: 'Default2' },
  ],
});
3

so it doesn’t work if we send options via template?

<mbsc-select
<mbsc-select-option value=“1”’
</mbsc-select-option
<mbsc-select-option value=“2”
</mbsc-select-option
<mbsc-select-option value=“3”
</mbsc-select-option
</mbsc-select