Dúvida a respeito da opção

Senhores (as), boa tarde!

Sou iniciante a respeito de desenvolvimento pelo fluig e venho tendo umas série de dúvidas, espero que vocês possam me ajudar.

Eu estou fazendo um formulário de importação e preciso que nele exista um botão (já esta feito).

O que eu preciso: Que antes de clicar "adicionar" os campos fiquem invisíveis e quando clicar no botão eles sejam ativados em forma de tabela, e toda vez que clicar no adicionar, gerar uma nova linha com esses campos, e que também tenham um botão para apagar cada linha que for gerada.

O meu código esta em anexo.

:warning: Atenção: Esta publicação foi transferida automaticamente do fórum antigo, mas os anexos não foram incluídos.

Acredito que precise de algo semelhante ao que está abaixo, tente adaptar ao seu fonte:

De uma olhada desta funcção incluiitem, ela cria através da wdkAddChild uma tabela com os itens desejados.

function incluiItem() { var linha = wdkAddChild('tbitens'); setZoomReadonly('armazem__'+linha, true); setZoomReadonly('marca'+linha, true); setZoomReadonly('referen'+linha, true); // setZoomReadonly('lote'+linha, true); reloadZoomFilterValues('caItem'+linha, 'empresa,'+$("#codEmpresa").val()); reloadZoomFilterValues('ugcItem'+linha, 'empresa,'+$("#codEmpresa").val()); setZoomReadonly('caItem'+linha, true); setZoomReadonly('ugcItem'+linha, true); setZoomReadonly('unidNegocio'+linha, true); setZoomReadonly('procNegocio'+linha, true); setZoomReadonly('unidNegocio'+linha, true); setZoomReadonly('ordemserv_'+linha, true);

}

function setSelectedZoomItem(selectedItem) { var id = selectedItem.inputId.split('')[1]; if (selectedItem.inputId.indexOf("produto") != -1) { //$('#codProduto'+id).val(selectedItem["B1COD"]); document.getElementById("codProduto__"+id).value = selectedItem["B1COD"]; $('#unidMedida__'+id).val(selectedItem["B1UM"]); reloadZoomFilterValues('armazem__'+id, 'PRODUTO,'+selectedItem["B1COD"]+',EMPRESA,'+$("#codEmpresa").val()); setZoomReadonly('armazem__'+id, false);

document.getElementById("codProduto"+id).value = selectedItem["B1_COD"]; $('#marca'+id).val(selectedItem["ZZXMARCA"]); reloadZoomFilterValues('marca__'+id, 'ZZXCODPRO,'+selectedItem["B1COD"]); setZoomReadonly('marca_'+id, false);

document.getElementById("codProduto"+id).value = selectedItem["B1_COD"]; $('#referen'+id).val(selectedItem["ZZXREFERE"]); reloadZoomFilterValues('referen__'+id, 'ZZXCODPRO,'+selectedItem["B1COD"]); setZoomReadonly('referen_'+id, false);

} if (selectedItem.inputId.indexOf("armazem") != -1) { $('#codArmazem'+id).val(selectedItem["B2_LOCAL"]); // setZoomReadonly('lote'+id, false); // reloadZoomFilterValues('lote'+id, 'B8_PRODUTO,'+$("#codProduto").val()+',EMPRESA,'+$("#codEmpresa").val()+',B8_LOCAL,'+selectedItem["B2_LOCAL"]); } else if (selectedItem.inputId.indexOf("caItem") != -1) { $('#codCaItem'+id).val(selectedItem["CTTCUSTO"]); } else if (selectedItem.inputId.indexOf("marca") != -1) { var id = selectedItem.inputId.split("__"); reloadZoomFilterValues('referen_' + id[1], "ZZX_MARCA," + selectedItem["ZZX_MARCA"]+",ZZX_CODPRO," + selectedItem["ZZX_CODPRO"]);

} else if (selectedItem.inputId.indexOf("referen_") != -1) {

document.getElementById("codProduto"+id).value = selectedItem["B1_COD"]; $('#referen'+id).val(selectedItem["ZZXREFERE"]); reloadZoomFilterValues('referen__'+id, 'ZZXCODPRO,'+selectedItem["B1COD"]); setZoomReadonly('referen_'+id, false);

} else if (selectedItem.inputId.indexOf("ordemserv") != -1) { $('#obsItem'+id).val(selectedItem["observacao"]); $('#codUgcItem'+id).val(selectedItem["UGC"]); $('#codUnidNegocio'+id).val(selectedItem["UNG"]); $('#codProcNegocio'+id).val(selectedItem["PNG"]); $('#codProduto_'+id).val(selectedItem["PRODUTO"]);

//Monta as constraints para consulta var empresa = $("#codEmpresa").val() var numos = $('#ordemserv_'+id).val()[0] var c1 = DatasetFactory.createConstraint("EMPRESA",empresa, empresa, ConstraintType.MUST); var c2 = DatasetFactory.createConstraint("os", numos, numos, ConstraintType.MUST); var constraints = new Array(c1, c2);

//Define os campos para ordenação var fields = new Array("os", "status","observacao","UGC","UNG","PNG","A2_COD","A2_LOJA","A2_NOME","A2_NREDUZ","A2_TIPO","A2_CGC","A2_INSCR","A2_EST","A2_MUN","A2_END","FORNECEDOR");

var dataset = DatasetFactory.getDataset("dsOS", fields, constraints, null);

var equipamento = dataset.values[0]["status"]; var observacao = dataset.values[0]["observacao"]; var UGC = dataset.values[0]["UGC"]; var UNG = dataset.values[0]["UNG"]; var PNG = dataset.values[0]["PNG"]; var A2_COD = dataset.values[0]["A2_COD"]; var A2_LOJA = dataset.values[0]["A2_LOJA"]; var A2_NOME = dataset.values[0]["A2_NOME"]; var A2_NREDUZ = dataset.values[0]["A2_NREDUZ"]; var A2_TIPO = dataset.values[0]["A2_TIPO"]; var A2_CGC = dataset.values[0]["A2_CGC"]; var A2_INSCR = dataset.values[0]["A2_INSCR"]; var A2_INSCR = dataset.values[0]["A2_INSCR"]; var A2_MUN = dataset.values[0]["A2_MUN"]; var A2_END = dataset.values[0]["A2_END"]; var FORNECEDOR = dataset.values[0]["FORNECEDOR"]; var PRODUTO = dataset.values[0]["PRODUTO"];

//$("#codProduto"+id).val(dataset.values[i,"status"]); $('#obsItem' + id).val(observacao); $('#produto' + id).val(equipamento); if (UGC != ""){ setZoomData('ugcItem' + id,UGC);} setZoomData('unidNegocio' + id,UNG); setZoomData('procNegocio' + id,PNG); setZoomData('produto_' + id,PRODUTO);

}

else if (selectedItem.inputId.indexOf("ugcItem") != -1) { $('#codUgcItem_'+id).val(selectedItem["CTH_CLVL"]);

} else if (selectedItem.inputId.indexOf("unidNegocio") != -1) { $('#codUnidNegocio'+id).val(selectedItem["Z4_COD"]); } else if (selectedItem.inputId.indexOf("procNegocio") != -1) { $('#codProcNegocio'+id).val(selectedItem["Z5COD"]); } /*else if (selectedItem.inputId.indexOf("lote") != -1) { $('#subLote__'+id).val(selectedItem["B8NUMLOTE"]); $('#dtValidade__'+id).val(selectedItem["B8_DTVALID"]); }*/

if (selectedItem.inputId == "fornecedor") { $('#codFornecedor').val(selectedItem["A2_COD"]); $('#lojaFornecedor').val(selectedItem["A2_LOJA"]); $('#cnpjFornecedor').val(selectedItem["A2_CGC"]); $('#nomeReduzido').val(selectedItem["A2_NREDUZ"]); $('#inscricaoEstadual').val(selectedItem["A2_INSCR"]); $('#municipio').val(selectedItem["A2_MUN"]+'-'+selectedItem["A2_EST"]);

if (selectedItem["A2_TIPO"] == 'J') { $("#lblDocFornecedor").html('CNPJ'); } else { $("#lblDocFornecedor").html('CPF'); }

} }

function removedZoomItem(removedItem) { var id = removedItem.inputId.split('')[1]; if (removedItem.inputId.indexOf("produto") != -1){ $('#codProduto'+id).val(""); $('#codArmazem'+id).val(""); removeItemZoom("armazem"+id); setZoomReadonly('armazem'+id, true); $('#unidMedida'+id).val(""); $('#marca'+id).val(""); $('#referen'+id).val(""); /removeItemZoom("lote"+id); setZoomReadonly('lote'+id, true); $('#subLote'+id).val(""); $('#dtValidade'+id).val("");/ } else if (removedItem.inputId.indexOf("armazem") != -1){ $('#codArmazem'+id).val(""); /*removeItemZoom("lote"+id); setZoomReadonly('lote'+id, true); $('#subLote'+id).val(""); $('#dtValidade'+id).val("");/ } /else if (removedItem.inputId.indexOf("lote") != -1){ $('#subLote'+id).val(""); $('#dtValidade_'+id).val(""); }*/

if (removedItem.inputId == "fornecedor") { $('#cnpjFornecedor').val(""); $('#nomeReduzido').val(""); $('#inscricaoEstadual').val(""); $('#municipio').val(""); } else if (removedItem.inputId.indexOf("ordemserv") != -1){ $('#obsItem'+id).val(""); $('#codUgcItem'+id).val(""); $('#codUnidNegocio'+id).val(""); $('#codProcNegocio'+id).val(""); $('#codProduto_'+id).val("");

} }