Bom dia!
Foi criado um dataset em que ele recebeu os dados de um WebService.
Precisamos utilizar este dataset em um DataTable em que possua campo text que ao começar a digitar, exiba somente referente a esta busca.
Após ter pesquisado, a linha terá que ser selecionada para que no formulário seguinte os campos possam ser preenchidos automaticamente com estes dados.
Alguém poderia me ajudar nisto? Obrigada.
Exemplo:
Bom dia!
Muito obrigada Felipe, mas não iremos utilizar widget, somente no form mesmo. Mas conseguimos fazer, segue como foi feito caso alguém precise:
1- No form foi criado um novo arquivo .js e no html ele foi chamado, dentro do form foi criado um botão e ao ser clicado ele executa um evento, e foi adicionado a div: div id="target"></div
2- No arquivo .js no evento click foi definido em qual dataset ele irá utilizar e é colocado no DataTable com as colunas.
*ainda falta buscar conforme os filtros definidos nos campos.
O fluig tem um datatable similar a esse.
no código js da widget faça o seguinte:
var MyWidget = SuperWidget.extend({
//variáveis da widget
dados:[],
tabela:[],
//método iniciado quando a widget é carregada
init: function() {
var that = this;
that.dados = that.getDataset();
console.log(that.dados);
that.loadTable();
},
getDataset:function(){
var that = this;
var dataSet = DatasetFactory.getDataset("NOME_DO_SEU_DATASET", null, null, null); //colocar o nome do seu dataset
return dataSet;
},
loadTable:function(){
var that = this;
var cabecalho = [];
renderContent = [];
for (var i in that.dados.columns){
cabecalho.push({'title': that.dados.columns[i]});
renderContent.push(that.dados.columns[i]);
}
that.tabela= FLUIGC.datatable('#tabela', {
dataRequest: that.dados.values,
renderContent: renderContent,
header:cabecalho,
tableStyle : 'table-hover table-bordered table-striped',
search : {
enabled : true,
onlyEnterKey : true,
searchAreaStyle : 'col-md-5',
onSearch : function(res) {
if (res) {
var data = that.dados.values;
var search = data.filter(function(el) {
return (el.NOME_CAMPO_BUSCA_1.toUpperCase().indexOf(res.toUpperCase()) >= 0 || //colocar o nome do campo de busca.
el.NOME_CAMPO_BUSCA_2.toUpperCase().indexOf(res.toUpperCase()) >= 0 || //colocar o nome do campo de busca.
el.NOME_CAMPO_BUSCA_3.toUpperCase().indexOf(res.toUpperCase())>= 0) //colocar o nome do campo de busca. Repetir essa linha até todos os campos de busca
});
that.tabela.reload(search);
}else{
that.tabela.reload(that.dados.values);
}
}
}
});
}
});No HTML do view.ftl da widget use o código abaixo:
<div id="MyWidget_${instanceId}" class="super-widget wcm-widget-class fluig-style-guide" data-params="MyWidget.instance()">
<div class='row'>
<div class='col-md-12'>
<h3>Meu Título</h3>
</div>
</div>
<br>
<div class='row'>
<div class=col-md-12>
<div id='tabela'></div>
</div>
</div>
</div>
<script src='/webdesk/vcXMLRPC.js' type="text/javascript"></script>