当服务器返回超过 1 个选项时，尝试将 .editable 类型表单Text更改为Select2但是当我尝试将类型从Text更改为Select2时，它仍然保持为Text
我已经将可编辑的 JS 包装在一个函数中，以便在成功时调用，我可以看到数据属性正在更改，但可编辑的却没有。
我尝试使用数据表更新函数来重新渲染行，但是即使我只传入两个或所有参数，也不会调用 rowCallback 函数，即
oTable.fnUpdate(aData,nRow);
oTable.fnUpdate(aData,nRow,undefined,false,false);
我试图删除可编辑$('td', nRow).eq(3).off()的事件侦听器，但这只是出于某种非常奇怪的原因删除了单元格。
function updateModifierCell(nRow,aData){
$('td' , nRow).eq(3)
.attr('title',aData.modifierString || '<i><small>No value</small></i>')
.attr('data-pk',aData.id)
.attr('data-name',aData.modifierID > 0 ? 'modifier_id' : 'modifier_name')
.attr('data-sname','modifier')
.attr('data-value',aData.modifierID)
.attr('data-type',aData.modifierID > 0 ? 'select' : 'text')
.editable({
mode: 'inline',
display: function(value){
if(aData.modifierID == null || aData.modifierID > 0){
return '';
}else{
return value;
}
},
ajaxOptions: {
type: "put",
dataType: "json",
success: function(data){
aData = setImportData(data);
//oTable.fnUpdate(aData,nRow,undefined,false,false);
updateModifierCell(nRow,aData);
},
error: function(){
log('Error sending import update.')
}
},
url: aData.url + '/' + aData.id
});
}
//Datatables init for reference
oTable = $target.find('#tableImport').dataTable({
"bDestroy": true,
"bRetrieve": true,
"fnRowCallback": function( nRow, aData, iDataIndex ) {
if(aData.status == null){
for(var colIndex = 0, colLength = nRow.cells.length; colIndex < colLength; colIndex++){
switch(colIndex){
//Spreadsheet Value
case 0:
//$('td' , nRow).addClass('focused');
break;
//Name
case 1:
$('td' , nRow).eq(colIndex)
.attr('title',aData.productString)
.attr('data-pk',aData.id)
.attr('data-name',aData.productOptions.length == 0 ? 'product_name' : 'product_id')
.attr('data-sname','product')
.attr('data-value',aData.productOptions.length == 0 ? aData.productString : aData.productID)
.attr('data-type', aData.productOptions.length == 0 ? 'text' : 'select2')
.editable({
mode: 'inline',
source: aData.productOptions,
ajaxOptions: {
type: "put",
dataType: "json",
display: function(value){
return value
},
success: function(data){
//aData.category = findObjectWith(data.product_matches,'id',data.product_id).product_category_desc;
aData = setImportData(data);
oTable.fnUpdate(aData,nRow,undefined,false,false);
},
error: function(){
log('Error sending import update.')
}
},
url: aData.url + '/' + aData.id
});
break;
//Modifier
case 3:
updateModifierCell(nRow,aData);
break;
//Price
case 4:
$('td' , nRow).eq(colIndex)
.attr('title','Edit Price')
.attr('data-pk',aData.id)
.attr('data-name','price')
.attr('data-type','text')
.editable({
mode: 'inline',
ajaxOptions: {
type: "put",
dataType: "json",
success: function(data){
aData = setImportData(data);
oTable.fnUpdate(aData,nRow,undefined,false,true);
},
error: function(){
log('Error sending import update.')
}
},
url: aData.url + '/' + aData.id
});
break;
//EPOS
case 5:
$('td' , nRow).eq(colIndex)
.attr('title','Edit EPOS ID')
.attr('data-pk',aData.id)
.attr('data-name','epos_id')
.attr('data-type','text')
.editable({
mode: 'inline',
ajaxOptions: {
type: "put",
dataType: "json",
success: function(data){
aData = setImportData(data);
oTable.fnUpdate(aData,nRow,undefined,false,true);
},
error: function(){
log('Error sending import update.')
}
},
url: aData.url + '/' + aData.id
});
break;
//Prep Time
case 6:
$('td' , nRow).eq(colIndex)
.attr('title','Edit Preperation Time')
.attr('data-pk',aData.id)
.attr('data-name','preparation_time')
.attr('data-type','text')
.editable({
mode: 'inline',
ajaxOptions: {
type: "put",
dataType: "json",
success: function(data){
aData = setImportData(data);
oTable.fnUpdate(aData,nRow,undefined,false,true);
},
error: function(){
log('Error sending import update.')
}
},
url: aData.url + '/' + aData.id
});
break;
}
}
// Set Tooltip for Title and Desc
$('.col-tooltip',nRow).each( function(){
$(this).tooltip({
delay: 0,
track: true,
fade: 250,
html: true,
content: function(){
return '<div class="text-center"><small>Spreadsheet Value</small><br/>' + $(this).attr('title') + '</div>';
}
});
});
},
"fnDrawCallback": function(){
},
"aaData": data,
"aoColumns": [
{ "mData": "spreadsheet" ,"sTitle":"Original Value" ,sClass: "center focused" ,sWidth: "80px" ,bSortable: true },
{ "mData": "product" ,"sTitle":"Product Name" ,sClass: "left col-tooltip" ,sWidth: "80px" ,bSortable: true },
{ "mData": "category" ,"sTitle":"Category" ,sClass: "center" ,sWidth: "80px" ,bSortable: true },
{ "mData": "modifier" ,"sTitle":"Modifier" ,sClass: "center col-tooltip" ,sWidth: "80px" ,bSortable: true },
{ "mData": "price" ,"sTitle":"Price" ,sClass: "center" ,sWidth: "20px" ,bSortable: true },
{ "mData": "epos" ,"sTitle":"EPOS" ,sClass: "center" ,sWidth: "20px" ,bSortable: true },
{ "mData": "preparation_time" ,"sTitle":"Prep Time" ,sClass: "center" ,sWidth: "20px" ,bSortable: true },
{ "mData": "buttons" ,"sTitle":"" ,sClass: "center" ,sWidth: "20px" ,bSortable: false }],
"aaSorting": [[ 0, 'asc' ]],
"bDeferRender": true,
"bProcessing": true,
"sPaginationType": "bootstrap",
"bSortable": true,
"bSort": true,
"sDom": 'Rfrp t<"pull-left"i><"pull-right"l>'
});