How to preselect Options in a Select
How to preselect Options in a Select
arichardson
Posts: 16Questions: 3Answers: 0
Hey Alan.
I have a Datatable setup and Editor, and everything is working splendidly EXCEPT for one thing.
I have one field defined as a SELECT with MULTIPLE, but normally (meaning when DT is browsing the records) the column displays a COLUMN DELIMITED LIST.
When I click on the cell, it switches into EDIT mode, and displays the MULTIPLE SELECT populated with a list of users.
However, I cannot for the life of me figure out how to preselect the same users in the select that are in the list that makeup the value of the cell.
HELP!
EDITOR definition:
editor = new $.fn.dataTable.Editor({
ajax: "drlAndTitle_test.cfc?method=dtAction",
table: "#drltitletable",
idSrc: "ELINID",
fields: [ {
label: "REVIEWERS:",
name: "REVIEWERS",
type: "select",
multiple: true
}
});
The following code is what I use to preload the SELECT:
$.ajax({
type: "GET",
datatype: 'json',
url: "drlAndTitle_test.cfc?method=getMemberListByRole&ReturnFormat=json",
data: {PROJECTSPECIFIC: ps,t:2},
success: function(newOptions){
var t = JSON.parse(newOptions);
editor.field( 'REVIEWERS' ).update( t.DATA );
},
fail: function(response){
alert(response);
}
});
How do I convert the CELL value (of a comma delimited list) into PRESELECTED values when the SELECT is displayed for EDIT MODE?
Example of the CELL value:
ABSMITH, ACBEQARI, ACDANIEL, ACLANDSBURG
Perhaps I am just being think headed... and there is a way to have Editor just select the values that are present in the list... I just don't see it.
Thanks for your help!
Replies
Are the values for the options in the select list different from the labels? e.g. do you have something like:
as the options in the select list? If so, the key here is that you need to tell Editor to use the values (e.g. 1 from the above option) while DataTables needs to be told to use the labels for the display.
Could you show me the JSON data that is used to load the table and also the DataTables and Editor configurations that you are using please?
Thanks,
Allan
Here is the AJAX response . It's just the LABEL rather than a LABEL and its VALUE.
And here is all of the configuration for setting up the DT and EDITOR:
Thanks for the information. It looks like the issue might be related to the fact that each item in the options array for the multiple select is an array with a single value - for example would it be possible to change
["ACHUFFMAN"]to simply be"ACHUFFMAN"- i.e. have an array of strings rather than an array of array of strings?What does the
REVIEWERSproperty in the JSON data that the DataTable sees look like?Allan
Well, let me play with it. I am using ColdFusion server side, and that is the way it converts a ColdFusion STRUCT object into JSON.
This is what the data that is used to populate the DT looks like:
OK, I have converted my code to create the following:
However, DTs doesn't seem to like that format either, since now it's not even populating my dropdowns at all. I suppose I could hard code the return format a specific way. What does DT look for in the return?
Well, I did tweak my JS a bit, and now its populating the dropdowns as it was before, using the AJAX format in the comment above.
However, it's still not preselecting any of the options.
Here is the updated function used populate the REVIEWERS dropdown:
These are comma+space delimited - we need to tell Editor this fact so it can split the string as required. At the moment it is trying to find a value that matches that full string!
You can do that with the
separatoroption of theselectfield type. In this case you have a comma+space so it would be:Regards,
Allan
Wow! That did it!
Thanks so much! You saved me a lot of time trying to figure that out.
Good to hear that worked! Thanks for letting me know.
Regards,
Allan