Multiselect - setting the initial value

david.mcshane · November 2022

Hi
I'm new to the editor plugin so I apologize if this is a newbie question.
I am trying to get inline editing working with a multiselect. I've almost got it but cant seem to get the initialization right.

I have got an inline version of editor working with data populated from a Rest Api but for simplicity I've created this example:
http://live.datatables.net/nasotapu/2/edit

The office is a multiselect:

{
label: 'Office:',
name: 'office',
type: 'select',
 multiple: true,
options: ['Tokyo', 'London', 'Edinburgh', 'San Francisco']
},

This seems to work, so in the demo, if you select 2 options the data passed back from the multiselect is comma delimited values (e.g. 'Tokyo,London')
This is fine, and when you go back to the cell you edited - it will remember the Tokyo and London selections and you can change them.

However, when I load the datatable with office as a comma delimited value (e.g. 'Tokyo,London') it will not have those values selected when I click into the cell and it shows the dropdown. It looks like nothing is selected.

Any ideas would be greatly appreciated!
David

allan · November 2022

However, when I load the datatable with office as a comma delimited value (e.g. 'Tokyo,London')

You need to tell the select input to expect and return strings rather than arrays. You can do that with the separator option: http://live.datatables.net/nasotapu/3/edit .

Allan

david.mcshane · November 2022

Brilliant stuff Allan, that worked. Really appreciate the quick response.
Thank you
David

david.mcshane · November 2022

Sorry to be asking another question on the same topic, but I tried to get the multi-select working with the chosen plugin.

https://editor.datatables.net/plug-ins/field-type/editor.chosen

Again, its all working apart from the initialization. Chosen seems to pass back the data in a comma delimited string, but it wont initialize the select with comma delimited values.

e.g. if the initial values are: Tokyo,London it just comes up as blank on select.

http://live.datatables.net/lokalibe/1/edit

I've tried setting the separator but maybe chosen expects the data in a different format for datatables?

{
                label: 'Office:',
                name: 'office',
                //type: 'select',
                type: 'chosen',  //changed to chosen
                multiple: true,
                options: ['Tokyo', 'London', 'Edinburgh', 'San Francisco'],
                separator: ',',
                //add the multiple attribute the to select
                attr: {
                      multiple: 'true',
                },
                //remove the search feature
                opts: {
                   "disable_search": true,
                   "inherit_select_classes": true,
                   //"separator": ", ",
               }
},

Thanks to anyone that can help!
David

allan · November 2022

Hi David,

Your Chosen plug-in doesn't have a separator option and I don't see such an option the Chosen docs. However, it is fairly straightforward to add in this case, which I've done here: http://live.datatables.net/lokalibe/3/edit .

Allan

david.mcshane · November 2022

Brilliant stuff Allan! Thanks again that's perfect!! Great product and support so thankyou!

Multiselect - setting the initial value

Multiselect - setting the initial value

Answers

Howdy, Stranger!

Categories

DataTables

Multiselect - setting the initial value

Multiselect - setting the initial value

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables