Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

A seguir serão detalhados os eventos disponíveis para a customização de uma definição de formulário no fluig.

 

...

afterProcessing

É o último evento a ser disparado para o formulário. O evento recebe como parâmetro uma referência ao formulário da definição de formulário.

...

No contexto deste evento a variável form pode ser usada somente para consulta aos campos da definição de formulário, seus valores e estado de apresentação.

 

...

afterSaveNew

Esse evento é disparado após a criação de um novo formulário. O evento recebe como parâmetro uma referência ao formulário da definição de formulário.

...

A consulta aos campos do formulário é case insensitve. No exemplo acima, poderíamos obter o valor do campo usando rnc_colab_abertura.

 

...

beforeProcessing

Esse evento é o primeiro a ser disparado. Ocorre antes de qualquer outro evento da definição de formulário. O evento recebe como parâmetro uma referência ao formulário da definição de formulário.

...

Bloco de código
languagejavascript
function beforeProcessing(form){
}

No contexto deste evento a variável form pode ser usada somente para consulta aos campos da definição de fromulárioformulário, seus valores e estado de apresentação.

 

...

displayFields

Esse evento é disparado no momento em que os objetos do formulário são apresentados. O evento recebe como parâmetro uma referência ao formulário da definição de formulário e a referência para saída de apresentação do formulário.

...

Bloco de código
languagejavascript
 function displayFields(form, customHTML) {
   if ( form.getFormMode() == “MOD” ) {
     form.setValue('RNC_colab_abertura', new java.lang.Integer(1));
   }
}

 

Ainda no evento DisplayFields displayFields é possível utilizar três métodos de forma independente ou conjunta para alterar a forma de como é apresentada a renderização do formulário, eliminar linhas de um formulário filho e ocultar os botões “Imprimir” e “Imprimir em nova Janela”.

...

 

Bloco de código
languagejavascript
function displayFields(form, customHTML) { 
   form.setVisible("campoA", false);
   form.setVisibleById("linha___1", false);
}

 

Formulário funcional com exemplos de utilização de setVisiblesetVisibleById, setHideDeleteButton e setHidePrintLink:


Bloco de código
languagexml
titleFormulário
linenumberstrue
collapsetrue
<html>
<head>
	<script type="text/javascript" src="/portal/resources/js/jquery/jquery.js"></script>
	<link type="text/css" rel="stylesheet" href="/portal/resources/style-guide/css/fluig-style-guide.min.css"/>
	<script type="text/javascript" src="/portal/resources/style-guide/js/fluig-style-guide.min.js" charset="utf-8"></script>
</head>
<body>
<div class="fluig-style-guide">
<form name="form" role="form">
	<h1>Ao Salvar <small> escolha o que ocultar ao salvar o formulário</small></h1>
	<p>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarTabela" value="on" >
	    Ocultar toda tabela
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarCampoA">
	    Ocultar campo A
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarCampoN1">
	    Ocultar campo N da primeira linha
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarCampoM2">
	    Ocultar campo M da segunda linha
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarLinha1">
	    Ocultar linha 1
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarExclusao">
	    Ocultar botão de excluir
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarImpressao">
	    Ocultar botão de imprimir
	    </label>
	</div>
	<div class="checkbox">
	    <label>
	    <input type="checkbox" name="ocultarLoremIpsum">
	    Ocultar Lorem Ipsum
	    </label>
	</div>
	<p><br><p>
	<input type="text" name="campoA" placeholder="Campo A" class="form-control" ></input><br>
	<p>
	<h2>Tabela de registros</h2>
	<table class="table table-bordered" tablename="tabelaTeste" addbuttonlabel="Novo Registro" cellspacing="0" width="100%" id="minhaTabela">
		<thead>
			<tr class="tableHeadRow">
				<td class="tableColumn">N</td>
				<td class="tableColumn">M</td>
			</tr>
		</thead>
		<tbody>
			<tr class="tableBodyRow" id="linha">
				<td><input class="form-control" name="campoN" type="text"></td>
				<td><input class="form-control" name="campoM" type="text"></td>
			</tr>
		</tbody>
	</table>
	<p>
	<div id="loremIpsum">
		Lorem Ipsum: Proin eget purus non mauris vehicula aliquam vitae sed est
	</div>
</form>
</div>
</body>
</html>


Bloco de código
languagejs
titledisplayFields.js
linenumberstrue
collapsetrue
function displayFields(form,customHTML){
	var ocultarTodaTabela = form.getValue("ocultarTabela") == "on"; // Ocultar toda tabela
	var ocultarCampoA = form.getValue("ocultarCampoA") == "on"; // Ocultar campo A
	var ocultarCampoN1 = form.getValue("ocultarCampoN1") == "on"; // Ocultar campo N da primeira linha
	var ocultarCampoM2 = form.getValue("ocultarCampoM2") == "on"; // Ocultar campo M da segunda linha
	var ocultarLinha1 = form.getValue("ocultarLinha1") == "on"; // Ocultar linha 1
	var ocultarExclusao = form.getValue("ocultarExclusao") == "on"; // Ocultar botão de excluir
	var ocultarImpressao = form.getValue("ocultarImpressao") == "on"; // Ocultar botão de imprimir
	var ocultarLoremIpsum = form.getValue("ocultarLoremIpsum") == "on"; // Ocultar a div Lorem Ipsum
	if ( ocultarTodaTabela ) {
		form.setVisibleById("minhaTabela", false); // bloqueia o campo, tabela ou div cujo id seja "minhaTabela"
	}
	if ( ocultarCampoA ) {
		form.setVisible("campoA", false); // bloqueia o campo com name "campoA"
	}
	if ( ocultarCampoN1 ) {
		form.setVisible("campoN___1", false); // bloqueia o campo com name "campoN___1"
	}
	if ( ocultarCampoM2 ) {
		form.setVisible("campoM___2", false); // bloqueia o campo com name "campoM___2"
	}
	if ( ocultarLinha1 ) {
		form.setVisibleById("linha___1", false); // bloqueia o campo, tabela ou div cujo id seja "linha___1"
	}
	if ( ocultarLoremIpsum ) {
		form.setVisibleById("loremIpsum", false); // bloqueia o campo, tabela ou div cujo id seja "loremIpsum"
	}
	if ( ocultarExclusao ) {
		form.setHideDeleteButton(true); // bloqueia o botão de exclusão de linha
	}
	if ( ocultarImpressao ) {
		form.setHidePrintLink(true); // bloqueia botão de imprimir
	}
}

 

 

É importante destacar que este evento é o único que permite a alteração dos valores a serem apresentados nos campos formulário antes da renderização deste.

...

Bloco de código
languageactionscript3
customHTML.append('<script>');
customHTML.append('$(function(){');
customHTML.append("loadProdutos();");
customHTML.append('});');
customHTML.append('</script>');

 

...

enableFields

Esse evento é disparado no momento em que os objetos do formulário são habilitados, permitindo desabilitar alguns campos, caso haja a necessidade. O evento recebe como parâmetro uma referência ao formulário da definição de formulário.

...

Bloco de código
languagejavascript
document.forms['nomeForm'].nomeCampo.setAttribute('readonly',true);

 

...

Nota
titleFique atento

Mesmo utilizando a função

...

setEnable, ainda existe a possibilidade de algum usuário conseguir visualizar informações do campo formulário

...

oculto, utilizando de recursos como a ferramenta

...

de inspeção de código dos navegadores.

 

Protegendo campos desabilitados 

...

Nota
titleAtenção!

O método setEnhancedSecurityHiddenInputs só protegerá campos desabilitados após a sua executação no evento.

...


inputFields

Esse evento é disparado no momento em que os dados do formulário são passados para a BO responsável por formulário do fluig. O evento recebe como parâmetro uma referência ao formulário da definição de formulário. Exemplo:

...

Nota
titleAtenção!

Este evento pode ser usado para que as datas persistidas por formulários customizados sejam salvas corretamente. Hoje no sistema as datas salvas através de formulários pelo navegador Chrome são salvas com padrão americano (yyyy-mm-dd), enquanto as datas nos demais navegadores são salvas com padrão brasileiro (dd/mm/yyyy). Para empresas que utilizam múltiplos navegadores e querem que os dados de data estejam padronizados, recomendamos a utilização do evento inputFields com o seguinte trecho de código.

 

Bloco de código
languagejs
titleCódigo para Datas
function inputFields(form) {
	if (form.getValue("NOME_DO_CAMPO_DATA").match("^[0-3]?[0-9]/[0-3]?[0-9]/(?:[0-9]{2})?[0-9]{2}$")) {
		var split = form.getValue("NOME_DO_CAMPO_DATA").split('/');
		form.setValue("NOME_DO_CAMPO_DATA", split[2] + '-' + split[1] + '-' + split[0]);
	}
}

 

...

setEnable

Esse evento pode ser executado em diferentes eventos das definições de formulário. Este evento não é implementado automaticamente na customização da definição de formulário.

...

Bloco de código
languagejavascript
function setEnable() {
  log.info(“Teste de chamada de função”);
}
 
function displayFields(form, customHTML) {
  setEnable();
}

 

...

validateForm

Esse evento é executado antes da gravação dos dados do formulário no banco de dados. O evento recebe como parâmetro uma referência ao formulário da definição de formulário. Em caso de erros de validação dos dados do formulário, esse evento retornará uma mensagem de erro para o usuário, através de uma modal do fluig, com a mensagem definida no evento.

...

Eventos de Formulário Pai Filho

Para facilitar a manipulação dos dados em uma customização de formulário que faz uso da técnica Pai Filho, foram disponibilizados os métodos listados a seguir. Ambos são chamados a partir do objeto form que é passado como parâmetro nas funções de customização de formulários.

 

getChildrenFromTable

Esse evento retorna um mapa com todos os campos filhos de um Pai Filho a partir do seu tablename.

 

getChildrenIndexes

Esse evento retorna os índices dos registros (linhas) contidos em um Pai Filho a partir do seu tablename.


 

Bloco de código
languagejava
themeEclipse
function validateForm(form){
    var indexes = form.getChildrenIndexes("tabledetailname");
    var total = 0;
    for (var i = 0; i < indexes.length; i++) {
        var fieldValue = parseInt(form.getValue("valor___" + indexes[i]));
        if (isNaN(fieldValue)){
            fieldValue = 0;
        } 
        total = total + fieldValue;
        log.info(total);
    }
    log.info(total);
    if (total < 100) {
        throw "Valor Total da requisição não pode ser inferior a 100";
    }
}

 

enableFields

Para utilizar o evento enableFields em um formulário Pai x Filho, é necessário ter o índice da linha a qual o campo a ser desabilitado pertence.

Uma forma de obter essa informação é através do método getChildrenIndexes conforme exemplo a seguir:

Bloco de código
languagejava
themeEclipse
function enableFields(form){ 
	var indexes = form.getChildrenIndexes("ingredientes");
    for (var i = 0; i < indexes.length; i++) {
    	form.setEnabled("quantidade___" + indexes[i], false);
    	form.setEnabled("unidade___" + indexes[i], false);
    	form.setEnabled("produto___" + indexes[i], false);
    }
}

 

...