Criar um cadastro simples pelo Widget

Widgets
3

Sim é possível e tranquilo.

VAMOS A UM SIMPLES PASSO A PASO AQUI:

1 - Primeiro crie um formulário igual ao de um processo mesmo.
2 - Crie sua widget em branco e cole no corpo dela seu formulario. para isso pode-se copiar toda a tag e cola-la na sua widget
3 - edite o script da sua widget e pronto.

Vou colocar o codigo fonte de cada arquivo e comenta-lo paar facilitar

VIEW.FTL

<div id="MyWidget_${instanceId}" class="super-widget wcm-widget-class fluig-style-guide" data-params="MyWidget.instance()">
	<form name="registro">
		<input type="text" name="teste" id="teste">
	</form>
	<button data-gravar>
		Gravar
	</button>
</div>

Onde MyWidget refere a superclasse do arquivo .js da widget

Javascrit.js

var MyWidget = SuperWidget.extend({
    //variáveis da widget
	
	codigodoformulario : '1803',
    
	//método iniciado quando a widget é carregada
    init: function() {
    },
  
    //BIND de eventos
    bindings: {
        local: {
            'execute': ['click_executeAction']
        },
        global: {
        	'gravar':['click_executeGravar']
        }
    },
 
    executeAction: function(htmlElement, event) {
    },
    
    executeGravar: function(){
    	
    	var dados={
    		"values": [
    			{
    				"fieldId": "teste",
    				"value": $("#teste").val(),
    			}
    		]
    	}
    	WCMAPI.Read({
    		type: "POST",
    		async: true,
    		url: '/ecm-forms/api/v2/cardindex/'+this.codigodoformulario+'/cards',
    	    contentType: "application/json",
    	    dataType: "json",
    	    data: JSON.stringify(dados),
    	    success: function(data){
    	        // código a ser executado em caso de sucesso
    	    	alert("dados criados com sucesso");
    	    }
    	});
    } 

});

A variável codigodoformulario contém o código do formulário que se encontra no GED
dentro do bindings temos os gatilhos dos eventos dos objetos do view.ftl
Repare que dentro da global temos

'gravar':['click_executeGravar']

onde gravar faz referencia a data-gravar na tag do botão na widget
e click_executeGravar faz chamada ao evento onclick do botão acionando a função de nome executeGravar

Exedcute_gravar por sua vez faz chamada a WCMAPI responsável por executar as chamadas as apis do fluig.

Dentro da ExecuteGravar temos a variável dados que contem todos os campos do formulário e seus respectivos valores para serem gravados.
A propriedade value do json e o formulário propriamente dito.
Dentro dela temos os vários registros onde fieldId e o nome campo do formulario que esta na propriedade name do input, e o value que corresponde ao conteúdo desse campo.
Pronto basta compilar sua widget e começar os testes cada vez que clicarmos no botão gravar ele vai gerar um novo registro de formulario.

Espero ter ajudado.

5 curtidas