Select2 is not loading the selected values when edit the row the first time in a page
Select2 is not loading the selected values when edit the row the first time in a page
Hi,
I have tried to create a test case but there is any issue adding the libs. If you can give me any clue about how to finish the test case I will: https://live.datatables.net/kaquqexa/3/
I have one field of type select2 (blend) with option: multiple and other (format) allowing only single values. When I load the first time the page and edit a row the modal editor is loaded without the selected values. However, if I edit a second time the values are loaded.
var editor = new DataTable.Editor({
ajax: {
create: '/save/${id}',
edit: '/update/',
remove: '/delete/',
idSrc: 'id'
},
fields: [
{
name: 'DT_RowId',
type: 'hidden',
},
{
label: 'Blend',
name: 'blend',
type: "select2",
separator: ":",
opts: {
"multiple": true,
"allowClear": true,
"separator": ":",
"placeholder": {
"id": "",
"text":"(Select blends)"
}
},
options: [
{ label: '', value: '' },
{ label: '9000 Extra', value: '9000'},
{ label: '9001 RA', value: '9001'},
{ label: '9001 Col', value: '9001'},
{ label: '900R Classic', value: '900R'}
]
},
{
label: 'Format',
name: 'format',
type: 'select2',
options: [
{ label: '', value: '' },
{ label: '0000 Auxiliary Materials', value: '0000' },
{ label: '0001 Lid 50g.', value: '0001' },
]
},
{
label: 'Reference',
name: 'reference',
type: 'datatable',
config: {
columns: [
{
title: 'Reference',
data: 'label'
}
]
},
options: [
{label:'', value:''},
{
label: '9022 sp.20 Kg',
value: '8020'
},
{
label: '22G0 spr.300Kg.',
value: '8023'
},
]
},
{
label: 'Quantity',
name: 'quantity'
},
{
label: 'Unit',
name: 'unit',
def: 'KG',
type: 'select',
options: [
{label: 'Caja', value: 'BOX'},
{label: 'Kilo', value: 'KG'},
]
},
{
label: 'Status',
name: 'status',
def: 'NO_ACTIVED',
type: 'select',
options: [
{label: 'Activo', value: 'ACTIVED'},
{label: 'No activo', value: 'NO_ACTIVED'},
]
},
{
label: 'quantity to reduce',
name: 'quantityToBeReduced',
},
],
table: '#items'
})
;
var table = new DataTable('#items', {
ajax: {
url: '/list/${id}'
},
columns: [
{ data: 'blends.description' },
{ data: 'formats.description' },
{ data: 'references.description' },
{ data: 'quantity' },
{ data: 'units.description' },
{ data: 'statuses.description' }
],
layout: {
topStart: {
buttons: [
{ extend: 'create', editor: editor },
{ extend: 'edit', editor: editor },
{ extend: 'remove', editor: editor }
]
}
},
select: true
});
Thank you very much.
This question has an accepted answers - jump to answer
Answers
Here is the example running: https://live.datatables.net/kaquqexa/4/edit . If not exactly working. I'm not entirely sure what the loaded data would be, and therefore not sure what the error you are seeing is.
In the example there is no data point named 'blend', so it won't be able to load the data. Also in the example the HTML sourced data is
9000 Extra Decaf SD/Aglo
which doesn't match avalue
in the list of options for the Select2 input.If you can show the Ajax loaded data for a row, that should help address these questions.
Allan
Thanks Allan for your support.
I have seen you have fixed the errors I did at prepare the test.
This is the json as response to the "list" called:
Thanks and regards.
Thank you. With that in the test case I can see the error happening: https://live.datatables.net/kaquqexa/8/edit .
I'll reply back later once I've had a chance to look into what is going wrong.
Allan
I updated the Select2 plugin to match the latest available plugin code and it seems to work as expected: https://live.datatables.net/kaquqexa/9/edit .
Allan
Thank you very much Allan. It is working as expected.