Estou tentando usar o datatable em um formulário BPM, cujo a finalidade é selecionar o campo código e descrição e preencher os respectivos input fileds correspondentes. Não encontrei nenhum exemplo que mostre de forma clara como se realiza o usando Jquery do Style Guide consumindo o dataset customizado. Segue meu código, porém não compreendo o que está faltando.
function init(){
$('#btMyModal').click( function() {
var myModal = FLUIGC.modal({
title: 'Usuários',
content: '<h5 class="alert alert-warning">Usuários</h5>'+'<div id="target"></div>',
id: 'fluig-modal',
size: 'large',
actions: [{
'label': 'Salvar',
'bind': 'data-open-modal',
},{
'label': 'Fechar',
'autoClose': true
}]
}, function(err, data) {
if(err) {
// do error handling
} else {
// do something with data
var that = this;
var datasetReturned = DatasetFactory.getDataset("colleague", null, null, null);
if (datasetReturned != null && datasetReturned.values != null && datasetReturned.values.length > 0) {
var records = datasetReturned.values;
that.mydata = [];
for ( var index in records) {
var record = records[index];
that.mydata.push({
id: record.userTenantId,
name: record.colleagueName,
email: record.mail
});
}
}
that.myTable = FLUIGC.datatable('#target', {
dataRequest: that.mydata,
renderContent: ['id', 'name', 'email'],
header: [{
'title': 'Code',
'dataorder': 'name',
'size': 'col-md-4'
}, {
'title': 'Name',
'standard': true,
'size': 'col-md-4'
}, {
'title': 'EMAIL',
'size': 'col-md-4',
'dataorder': 'ASC'
}],
search: {
enabled: true,
onlyEnterkey: true,
searchAreaStyle: 'col-md-5',
onSearch: function(res) {
that.myTable.reload(that.tableData);
if (res) {
var data = that.myTable.getData();
var search = data.filter(function(el) {
return el.name.toUpperCase().indexOf(res.toUpperCase()) >= 0;
});
that.myTable.reload(search);
}
}
},
selected: function(el, ev) {
var index = this.myTable.selectedRows()[0];
var selected = this.myTable.getRow(index);
$("#codnegocio").val(selected.id);
$("#nomenegocio").val(selected.name);
},
scroll: {
target: ".target",
enabled: true
},
actions: {
enabled: true,
template: '.mydatatable-template-row-area-buttons',
actionAreaStyle: 'col-md-6'
},
navButtons: {
enabled: true,
forwardstyle: 'btn-warning',
backwardstyle: 'btn-warning',
},
draggable: {
enabled: true
},
}, function(err, data) {
if (err) {
FLUIGC.toast({
message: err,
type: 'danger'
});
}
});
that.myTable.on('fluig.datatable.loadcomplete', function() {
if (!that.tableData) {
that.tableData = that.myTable.getData();
}
});
}
});
});
}
init();
$('.btn .btn-primary').on('click', '[data-your-selected-row-button]', function(ev) {
var index = myTable.selectedRows()[0];
var selected = myTable.getRow(index);
});