dropdown updates only if marked ??
dropdown updates only if marked ??
Michael Haehnel
Posts: 2Questions: 1Answers: 0
in Editor
Hello,
I have an editor data table and I am using drop down fields for some columns. When editing inline, I can't properly update the selected value of the dropdown box. The value is only updated if you then click on the dropdown field again and mark it. Can someone please help me to solve this problem?
thanks
var dropdownPerson = @Html.Raw(Json.Serialize(@ViewBag.Person));
var editor;
$(document).ready(function(){
editor = new $.fn.dataTable.Editor ({
ajax: {url: "/Controller/EditorTableMethod" , type: "POST"},
table: "#tableName",
fields: [{
label: "employees",
name: "employees",
type: "select",
options: dropdownPerson.value
}, ......
$('#tableName').on('click', 'tbody td:not(:first-child)', function (e) {
editor.inline(this);
});
$('#tableName').on( 'click', 'tr', function () {
$(this).toggleClass('selected');
});
var table = $('#tableName').DataTable({
dom: "Bfrtip",
//select: {
// style: 'multi'
//},
ajax: "/Controller/EditorTableMethod",
columns: [
{
data: null,
defaultContent: '',
className: 'select-checkbox',
orderable: false
},
{ data: "employees"}, ....
],
order: [[1, 'asc']],
displayLength: 25,
drawCallback: function (settings) {
var api = this.api();
var rows = api.rows({ page: 'current' }).nodes();
var last = null;
api.column(1, { page: 'current' }).data().each(function (group, i) {
if (last !== group) {
$(rows).eq(i).before(
'<tr class="group"><td colspan="5">'+group+'</td></tr>'
);
last = group;
}
});
},
select: {
style: 'multi',
selector: 'td:first-child'
},
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{
extend: "selected",
text: 'Duplicate',
action: function ( e, dt, node, config ) {
// Start in edit mode, and then change to create
editor
.edit( table.rows( {selected: true} ).indexes(), {
title: 'Duplicate record',
buttons: 'Create from existing'
} )
.mode('create');
}
},
{ extend: "remove", editor: editor },
'pageLength'
]
});
$(document).on('click', '#update', function () {
var a = [] ;
$.each(table.rows('.selected').data(), function () {
a.push(this.DT_RowId.substring(4));
var idRow = table.row( {selected: true}).id().substring(4);
});
var i;
for (i = 0; i < a.length; i++) {
$.ajax(
{
type: "POST",
dataType: "JSON",
url: "/Controller/AnotherMethod/" + a[i],
});
}
});
});
Answers
Try:
See this example for that in action. The key here is that a
select
isn't the easiest to submit - submitting on blur solves that.Allan
Hi Allan,
unfortunately this did not work...
Could you expand and see why it didn't work, please. Did the example that Allan link to work? And if not, what was the issue there.
Colin