Optgroups inside field select option..
Optgroups inside field select option..
i'm trying to create a select multiple field with optgroups:
i create the html field with create function, and it shows fine but when i try to save the selected options but doesn't do nothing, the same thing when i click on editor inline, doesn't show the setted values.
here is my code..
```
// Todo field type plug-in code
(function ($, DataTable) {
if ( ! DataTable.ext.editorFields ) {
DataTable.ext.editorFields = {};
}
var Editor = DataTable.Editor;
var _fieldTypes = DataTable.ext.editorFields;
_fieldTypes.select = {
create: function ( conf ) {
var that = this;
// Create the elements to use for the input
//Utilizamos el método jquery .when() para esperar que finalice ajax1() y tenga la variable html seteada
conf._input = $('<select>'+
'<optgroup label="Options 1">'+
'<option>Option 1.1</option>'+
'<option>Option 1.2</option>'+
'</optgroup>'+
'<optgroup label="Options 2">'+
'<option>Option 2.1</option>'+
'<option>Option 2.2</option>'+
'</optgroup>'+
'select>');
return conf._input;
}
};
})(jQuery, jQuery.fn.dataTable);
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
ajax: "./resources/modules/dataTables/php/mm_exp_userProfiles.php",
table: "#tableditor",
fields: [
{ label: "Name:", name: "name" },
{ label: "Pages:", name: "pages", type: "select", separator: ',', multiple: true }
]
} );
// Activate an inline edit on click of a table cell
$('#tableditor').on( 'click', 'tbody td:not(:first-child)', function (e) {
editor.inline( this );
console.log(this);
} );
$('#tableditor').DataTable( {
dom: "Bfrtlp",
ajax: "./resources/modules/dataTables/php/mm_exp_userProfiles.php",
columns: [
{ data: "name" },
{ data: "pages" }
],
select: {
style: 'multiple',
selector: 'td:first-child'
},
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
} );
$('#approve').on( 'click', function () {
editor
.edit( false )
.val( 'approved', 1 )
.submit();
} );
} );
```
Answers
Hi,
I've afraid that this currently isn't possible with Editor. Editor uses a property attached to the option elements called
_editor_valwhich is used to store the value. It does this in order to allow type safe selection (e.g.0v'0'andtruev'true').You could try adding that property to each DOM node (e.g.
option._editor_val = ...- not just an attribute) I think it would work, but that's a bit of an "if"!Regards,
Allan