...
Deck of Cards |
---|
|
Card |
---|
label | Localizar o formulário |
---|
| Localizar o formulário 01. Dentro do ECM, localize o formulário que está sendo utilizado no processo e em seguida acione Propriedades. ![](/download/attachments/146181573/Localizar%20formul%C3%A1rio.png?version=1&modificationDate=1655477428187&api=v2&effects=drop-shadow) |
Card |
---|
label | Datasets do Formulário |
---|
| Datasets do formulário 02. Após acionar as clicar nas propriedades do formulário, navegue até a aba Datasets do Formulário e relacione o dataset ao qual está sendo utilizado no campo zoom.
![](/download/attachments/146181573/Datasets%20do%20formul%C3%A1rio.png?version=1&modificationDate=1655477577547&api=v2&effects=drop-shadow) |
|
...
Com a inclusão de formulários que suportem a visualização em dispositivos móveis, é possível movimentar solicitações workflow e realizar o preenchimento das informações de formulários com maior mobilidade e agilidade.
Pai x Filho e Zoom para dispositivos móveis
A partir do TOTVS Fluig Plataforma 1.5.2 (server), temos uma técnica para utilização de Pai e Filho e Zoom que vai facilitar em muito o desenvolvimento sobre nossa plataforma. Usando o Fluig Style Guide tudo ficará mais responsivo e esses dois componentes se adequam a web e ao mobile.
Image Removed
Image Removed
Nota |
---|
|
- O Fluig dispõe de um serviço nativo para consumo de dados de datasets no componente de zoom. Não é permitido o uso de serviços personalizados para este componente.
- Procure utilizar um número limitado de campos em componentes de Zoom para que se adequem melhor ao tamanho de tela. A utilização de um grande número de campos, ou do zoom dentro outros componentes, pode comprometer a visualização dos dados.
|
Nota |
---|
title | Atenção - Trabalhando com tabelas |
---|
|
|
Insira anexos da solicitação diretamente do formulário
Há uma maneira bem simples para salvar anexos upload através de um botão no formulário. Para isso é necessário inserir no evento onclick do button o método showCamera:
Nota |
---|
|
Não é recomendada a troca do nome da função para o método showCamera no iOS. Isso faz com que o método não funcione conforme o esperado. |
Funções mobile
...
getAttachments
É uma função que retorna uma Promise com a lista dos anexos do formulário. Funciona de forma offline.
No exemplo abaixo foi utilizado um await para aguardar a lista dos arquivos que pode ser vazia, caso não haja anexos.
Bloco de código |
---|
language | js |
---|
title | Chamada no JS |
---|
|
var listaArquivos = await JSInterface.getAttachments();
|
O objeto retorna sempre um json que é uma lista de arquivos. Cada arquivo pode ou não ter os dados, conforme abaixo:
Bloco de código |
---|
language | js |
---|
theme | Eclipse |
---|
linenumbers | true |
---|
|
[{
"documentId": 4917,
"version": 1000,
"createDate": 1713872206178,
"newAttach": false,
"size": 1.2485828,
"fileName": "file.pdf",
"description": "file.pdf",
"streamControlUrl": "" //Pode ser http ou caminho do arquivo /folder/file.pdf
}] |
Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
|
Caso não tenha a informação no arquivo anexado, o valor será null por padrão. |
Exemplo de chamada no JS de forma async:
Bloco de código |
---|
|
async function getFiles() {
var listFiles = await JSInterface.getAttachments();
} |
beforeValidateAttachments
...
Este evento acontece ao clicar em "enviar" no navegador antes de abrir a tela de movimentação. Por isso, esse código deve ser implementado em um arquivo javascript vinculado ao formulário html. Ele recebe um parâmetro que é a lista de todos os anexos que estão vinculados no formulário e é muito útil para algumas validações antes mesmo de ser enviado para o servidor.
Bloco de código |
---|
|
var beforeValidateAttachments = function (listFiles) {
if (listFiles.length == 0) {
throw 'Necessário incluir um anexo.';
}
} |
- Os dados sempre serão uma lista de arquivos com os valores:
Bloco de código |
---|
language | powershell |
---|
theme | Eclipse |
---|
linenumbers | true |
---|
|
[{
"documentId": 0, //0 caso for novo anexo
"version": 0, //0 caso for novo anexo
"createDate": null,
"newAttach": true, //true para novo anexo
"size": 1.2485828, // tamanho do arquivo em MB
"fileName": "file.pdf",
"description": "file.pdf",
"streamControlUrl": "" //Pode ser http ou caminho do arquivo /folder/file.pdf
}] |
Pai x Filho e Zoom para dispositivos móveis
...
A partir do TOTVS Fluig Plataforma 1.5.2 (server), temos uma técnica para utilização de Pai e Filho e Zoom que facilita o desenvolvimento sobre a plataforma. Usando o Fluig Style Guide tudo ficará mais responsivo e esses dois componentes se adequam a web e ao mobile.
Image Added
Image Added
Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
|
Leia mais detalhes na nossa documentação: Desenvolvimento de Formulários - Zoom e Desenvolvimento de Formulários - Pai x Filho. |
Nota |
---|
|
- O Fluig dispõe de um serviço nativo para consumo de dados de datasets no componente de zoom. Não é permitido o uso de serviços personalizados para este componente.
- Procure utilizar um número limitado de campos em componentes de Zoom para que se adequem melhor ao tamanho de tela. A utilização de um grande número de campos, ou do zoom dentro outros componentes, pode comprometer a visualização dos dados.
|
Nota |
---|
title | Atenção - Trabalhando com tabelas |
---|
|
|
Insira anexos da solicitação diretamente do formulário
...
Há uma maneira bem simples para salvar anexos upload através de um botão no formulário. Para isso é necessário inserir no evento onclick do button o método showCamera:
Nota |
---|
|
Não é recomendada a troca do nome da função para o método showCamera no iOS. Isso faz com que o método não funcione conforme o esperado. |
Bloco de código |
---|
|
<input type="button" value="Insira Foto" onclick="showCamera('Nome do arquivo em anexo');"/>
<script language="javascript">
function showCamera(param) {
JSInterface.showCamera(param);
}
</script> |
O parâmetro passado na função JSinterface.showCamera é uma String e corresponde ao nome do anexo que será salvo na listagem de anexos daquela solicitação.
Nota |
---|
|
No My Fluig somente imagens podem ser adicionadas como anexo. É possível escolher uma imagem da galeria ou ainda tirar uma foto usando a câmera. |
Informações |
---|
title | A partir da atualização 1.5.5 |
---|
|
O método JSinterface.showCamera, também é aplicado na plataforma web. Acessando o Fluig Plataforma pelo navegador, ao clicar em um botão utilizando o recurso você será direcionado para a aba Anexos e uma janela será exibida para a seleção dos arquivos. Acessando a aba de Anexos será possível realizar o upload de apenas um arquivo por vez. Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
| Tentar selecionar mais que um causará erro. |
Image Added
|
Desabilite o evento Pull to refresh do componente nativo
...
Há uma maneira bem simples para desabilitar o evento de Pull to refresh responsável por atualizar os dados do formulário. Para isso é necessário inserir o método disablePullToRefresh:
Bloco de código |
---|
|
Bloco de código |
---|
|
<input type="button" value="Insira Foto" onclick="showCamera('Nome do arquivo em anexo');"/>
<script language="javascript">
function showCameradisablePullToRefresh(param) {
JSInterface.showCamera(param);
}
</script> |
O parâmetro passado na função JSinterface.showCamera é uma String e corresponde ao nome do anexo que será salvo na listagem de anexos daquela solicitação.
Nota |
---|
|
No My Fluig somente imagens podem ser adicionadas como anexo. É possível escolher uma imagem da galeria ou ainda tirar uma foto usando a câmera. |
...
title | A partir da atualização 1.5.5 |
---|
O método JSinterface.showCamera, também é aplicado na plataforma web. Acessando a plataforma Fluig pelo navegador, ao clicar em um botão utilizando o recurso você será direcionado para a aba Anexos e uma janela será exibida para a seleção dos arquivos.
Acessando a aba de Anexos será possível realizar o upload de apenas um arquivo por vez
Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
|
Tentar selecionar mais que um causará erro. |
Image Removed
Como identificar se estou usando o mobile nos eventos?
...
Com esse recurso é possível aplicar um desenvolvimento e/ou restrição somente no formulário mobile, independente da Web. Assim posso definir que um processo ou atividade vai receber um valor diferenciado ou que determinada atividade não pode ser executada pelo mobile via desenvolvimento.
Existe duas formas de fazer tal desenvolvimento:
Eventos do Formulário
...
Todos os eventos que recebem no método o form podem fazer um desenvolvimento exclusivo para o formulário mobile:
- AfterProcessing
- AfterSaveNew
- BeforeProcessing
- DisplayFields
- EnableFields
- InputFields
- ValidadeForm
Para utilizar o evento é necessário fazer a seguinte chamada: form.getMobile(), onde retornará um booleano indicando se é um formulário mobile ou não. Exemplo:
Bloco de código |
---|
|
function displayFields(form, customHTML) {
if ( form.getMobile() != null && form.getMobile()) {
form.setValue('mtr_usuario', new java.lang.Integer(123456));
}
} |
Eventos do Processo
- beforeMovementOptions
- beforeSendValidate
Nota |
---|
|
Os eventos "beforeMovementOptions" e "beforeSendValidate" serão executados no dispositivo mobile antes mesmo de serem enviados para o servidor. Para mais informações sobre estes eventos acesse a página Desenvolvimento de Workflow. |
Nos eventos de processo, a propriedade WKMobile identifica se a ação foi realizada pelo dispositivo móvel. Ela pode ser utilizada nos eventos do processo conforme exemplo
Desabilite o evento Pull to refresh do componente nativo
Há uma maneira bem simples para desabilitar o evento de Pull to refresh responsável por atualizar os dados do formulário. Para isso é necessário inserir o método disablePullToRefresh:
Bloco de código |
---|
|
<script language="javascript">
function disablePullToRefresh(){
return true;
}
</script> |
Como identificar se estou usando o mobile nos eventos?
Com esse recurso é possível aplicar um desenvolvimento e/ou restrição somente no formulário mobile, independente da Web. Assim posso definir que um processo ou atividade vai receber um valor diferenciado ou que determinada atividade não pode ser executada pelo Mobile via desenvolvimento.
Existe duas formas de fazer tal desenvolvimento:
Eventos do Formulário
Todos os eventos que recebem no método o form podem fazer um desenvolvimento exclusivo para o formulário mobile:
- AfterProcessing
- AfterSaveNew
- BeforeProcessing
- DisplayFields
- EnableFields
- InputFields
- ValidadeForm
Para utilizar o evento é necessário fazer a seguinte chamada: form.getMobile(), onde retornará um booleano indicando se é um formulário mobile ou não. Exemplo:
Bloco de código |
---|
|
function displayFields(form, customHTML) beforeStateEntry(sequenceId){
var isMobile = getValue("WKMobile");
if ( form.getMobile() isMobile!= null && form.getMobile()) {
form.setValue('mtr_usuario', new java.lang.Integer(123456));
}
} |
Eventos do Processo
...
Nota |
---|
|
Os eventos "beforeMovementOptions" e "beforeSendValidate" serão executados no dispositivo mobile antes mesmo de serem enviados para o servidor. Para mais informações sobre estes eventos acesse a página Desenvolvimento de Workflow. |
...
isMobile==true){
throw "Esse processo não pode ser executado pelo mobile.";
}
} |
Consumo de Datasets via xmlRPC
...
O acesso de datasets pelo mobile é realizado com o xmlPRC, desse modo é possível trocar de informações com Fluig via AJAX. Para utiliza-lo, basta acionar as seguintes importações no HTML do formulário:
Bloco de código |
---|
|
<script src="../vcXMLRPC.js"></script>
<script src="http://URL_DO_SERVIDOR/portal/resources/js/jquery/jquery.js"></script> |
O acesso aos Datasets é igual à web, a seguir são apresentados alguns exemplos:
Datasets internos Fluig
Este tipo de Dataset permite navegar em dados das entidades do próprio Fluig Plataforma, como usuários, grupos, processos ou tarefas por exemplo. Esses datasets são pré-definidos, por isso não podem ser alterados pelo usuário. A lista com os datasets disponíveis pode ser consultada aqui.
Bloco de código |
---|
language | js |
---|
linenumbers | true |
---|
|
var filter = new Object();
filter["colleaguePK.colleagueId"] = "john";
var colleagues = DatasetFactory.getDatasetValues("colleague", filter);
if(colleagues.length > 0){
document.getElementById("colleagueName").value = colleagues[0].colleagueName;
document.getElementById("login").value = colleagues[0].login;
}else{
alert("Nenhum Usuário Encontrado");
} |
Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
|
Para atualizações anteriores ao TOTVS Fluig Plataforma 1.5.6, substituir a linha 3 por |
Bloco de código |
---|
|
function beforeStateEntry(sequenceId){
var isMobile = getValue("WKMobile");
if (isMobile!=null && isMobile==true){
throw "Esse processo não pode ser executado pelo mobile.";
}
} |
Consumo de Datasets via xmlRPC
O acesso de datasets pelo mobile é realizado com o xmlPRC, desse modo é possível trocar de informações com Fluig via AJAX.
Para utiliza-lo, basta acionar as seguintes importações no HTML do formulário: <scriptsrc"../vcXMLRPC.js"></script>
<script src="http://URL_DO_SERVIDOR/portal/resources/js/jquery/jquery.js"></script> |
O acesso aos Datasets é igual à Web, a seguir são apresentados alguns exemplos:
getDatasetValues("colleague", filter); |
|
Datasets internos formulário
Este Datasets internos Fluig: este tipo de Dataset permite navegar em dados das entidades do próprio Fluig plataforma, como usuários, grupos, processos ou tarefas por exemplo. Esses datasets são pré-definidos, por isso não podem ser alterados pelo usuário. A lista com os datasets disponíveis pode ser consultada aqui.nos dados existentes em formulários de uma determinada definição de formulário publicada no Fluig. Para que uma definição de formulário seja disponibilizada como Dataset, é necessário preencher o campo Nome Dataset na publicação da definição de formulário. O
valor informado será utilizado para a busca do Dataset no Fluig;
Bloco de código |
---|
|
var c1 = DatasetFactory.createConstraint("cod_area", "2", "2", ConstraintType.MUST);
var constraints = new Array(c1);
var area = DatasetFactory.getDataset("areas", null, constraints, null);
if(area.values.length){ |
Bloco de código |
---|
language | js |
---|
linenumbers | true |
---|
|
var filter = new Object();
filter["colleaguePK.colleagueId"] = "john";
var colleagues = DatasetFactory.getDatasetValues("colleague", filter);
if(colleagues.length > 0){
document.getElementById("colleagueNamecod_area").value = colleaguesarea.values[0].colleagueNamecod_area;
document.getElementById("loginarea").value = colleaguesarea.values[0].loginarea;
}else{
alert("Nenhum Usuário Encontrado");
}Area não encontrada") ;
} |
Painel |
---|
borderColor | #f2f2f2 |
---|
bgColor | #f2f2f2 |
---|
|
Para fazer o download de um exemplo de formulário utilizando xmlPRC clique aqui. |
Chamadas assíncronas
A partir do Atenção: Para atualizações anteriores ao TOTVS Fluig Plataforma 1.5.6, substituir a linha 3 poré possível realizar chamadas assíncronas:
Bloco de código |
---|
|
var colleaguesfilter = getDatasetValues("colleague", filter); |
2) Datasets internos formulário: este tipo de Dataset permite navegar nos dados existentes em formulários de uma determinada definição de formulário publicada no Fluig. Para que uma definição de formulário seja disponibilizada como Dataset, é necessário preencher o campo Nome Dataset na publicação da definição de formulário. O valor informado será utilizado para a busca do Dataset no Fluig;
new Object();
filter["colleaguePK.colleagueId"] = "john";
var colleagues = DatasetFactory.getDatasetValues("colleague", filter,
{ success: function(colleagues) {
if(colleagues.length > 0){
document.getElementById("colleagueName").value = colleagues[0].colleagueName;
document.getElementById("login").value = colleagues[0].login;
}else{
alert("Nenhum Usuário Encontrado");
}
}, error: function(jqXHR, textStatus, errorThrown) {}
});
|
Bloco de código |
---|
|
Bloco de código |
---|
|
var c1 = DatasetFactory.createConstraint("cod_area", "2", "2", ConstraintType.MUST);
var constraints = new Array(c1);
var area = DatasetFactory.getDataset("areas", null, constraints, null);, {
success: function(area) {
if(area.values.length){
document.getElementById("cod_area").value = area.values[0].cod_area;
document.getElementById("area").value = area.values[0].area;
}else{
alert("Area não encontrada") ;
} |
Informações |
---|
Para fazer o download de um exemplo de formulário utilizando xmlPRC clique aqui. |
3) Chamadas assíncronas: A partir do TOTVS Fluig Plataforma 1.5.6, você também pode realizar chamadas assíncronas:
alert("Area não encontrada") ;
}
}
}, error: function(jqXHR, textStatus, errorThrown) {}
); |
Deck of Cards |
---|
|
Nota |
---|
| - A geolocalização funciona apenas em ambientes https. Em ambientes http o navegador não permite informar a geolocalização.
- Essa técnica pode ser aplicada em Android quanto em iOS.
|
Card |
---|
id | 1 |
---|
label | Geolocalização em formulários |
---|
|
Para utilizar a geolocalização em formulários, basta incluir esse script no html:
Bloco de código |
---|
| function getLocation()
{
|
|
|
Bloco de código |
---|
|
var filter = new Object();
filter["colleaguePK.colleagueId"] = "john";
var colleagues = DatasetFactory.getDatasetValues("colleague", filter,
{ success: function(colleagues) {
if(colleagues.length > 0){
document.getElementById("colleagueName").value = colleagues[0].colleagueName;
document.getElementById("login").value = colleagues[0].login;
}else{
alert("Nenhum Usuário Encontrado");
}
}, error: function(jqXHR, textStatus, errorThrown) {}
});
|
Bloco de código |
---|
|
DatasetFactory.getDataset("areas", null, constraints, null, {
success: function(area) {
if(area.values.length){
document.getElementById("cod_area").value = area.values[0].cod_area;
document.getElementById("area").value = area.values[0].area;
}else{
alert("Area não encontrada") ;
}
}
}, error: function(jqXHR, textStatus, errorThrown) {}
); |
Deck of Cards |
---|
|
Nota |
---|
| - A geolocalização só funciona em ambientes https. Em ambientes http o navegador não permite informar a geolocalização.
- Essa técnica pode ser aplicada em Android quanto em iOS.
|
Card |
---|
id | 1 |
---|
label | Geolocalização em formulários |
---|
| Para utilizar a Geolocalização em formulários é bem simples, basta incluir esse script no html: Bloco de código |
---|
| function getLocation()
{
if (navigator.geolocation)
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition,showError);
}
}
function showPosition(position)
{
var latlon=position.coords.latitude+","+position.coords.longitude;
var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
+latlon+"&zoom=14&size=300x200&sensor=false";
document.getElementById("map").innerHTML="<img src='"+img_url+"'>";
var lat = position.coords.latitude;
var longi = position.coords.longitude;
document.getElementById("latitude").value = lat;
document.getElementById("longitude").value = longi;
}
function showError(error)
{
navigator.geolocation.getCurrentPosition(showPosition,showError);
}
}
switch(error.code)
function showPosition(position)
{
varcase latlon=position.coords.latitude+","+position.coords.longitude;
error.PERMISSION_DENIED:
var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
+latlon+"&zoom=14&size=300x200&sensor=false"; doc.innerHTML="Pedido de Geolocalização negado pelo usuário."
document.getElementById("map").innerHTML="<img src='"+img_url+"'>";
var lat = position.coords.latitude;
var longi = position.coords.longitude;
document.getElementById("latitude").value = lat;
document.getElementById("longitude").value = longi break;
case error.POSITION_UNAVAILABLE:
doc.innerHTML="Informação de localização não está disponível."
break;
}
functioncase showError(error)
.TIMEOUT:
{
switch(error.code)
doc.innerHTML="Solicitação de localização não retornou em tempo hábil (timeout)."
{break;
case error.PERMISSIONUNKNOWN_DENIEDERROR:
doc.innerHTML="Erro desconhecido."
break;
}
} |
|
Card |
---|
id | 2 |
---|
label | Geolocalização em páginas |
---|
|
Para utilizar a geolocalização em páginas, processos e na home é bem simples, basta incluir esse script no html:
Bloco de código |
---|
| function getLocation()
{Pedido de Geolocalização negado pelo usuário."
break;
case error.POSITION_UNAVAILABLE:
if doc.innerHTML="Informação de localização não está disponível."(navigator.geolocation)
{ break;
case error.TIMEOUT:
doc.innerHTML="Solicitação de localização não retornou em tempo hábil (timeout)."
break;navigator.geolocation.getCurrentPosition(showPosition, showError, { timeout: 10000 });
}
}
function showPosition(position)
case error.UNKNOWN_ERROR: {
doc.innerHTML="Erro desconhecido."
break;var latlon=position.coords.latitude+","+position.coords.longitude;
}
} |
| Card |
---|
id | 2 |
---|
label | Geolocalização em páginas |
---|
| Para utilizar a Geolocalização em páginas, processos e na home é bem simples, basta incluir esse script no html: Bloco de código |
---|
| function getLocation()var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
{
if (navigator.geolocation)+latlon+"&zoom=14&size=300x200&sensor=false";
{
navigator.geolocation.getCurrentPosition(showPosition, showError, { timeout: 10000 });
}document.getElementById("map").innerHTML="<img src='"+img_url+"'>";
var lat = position.coords.latitude;
var longi = position.coords.longitude;
document.getElementById("latitude").value = lat;
document.getElementById("longitude").value = longi;
}
function showPositionshowError(positionerror)
{
var latlon=position.coords.latitude+","+position.coords.longitude;
switch(error.code)
var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
{
+latlon+"&zoom=14&size=300x200&sensor=false";case error.PERMISSION_DENIED:
document.getElementById("map"). doc.innerHTML="<img src='"+img_url+"'>";
var lat = position.coords.latitude;
var longi = position.coords.longitude;
document.getElementById("latitude").value = lat;
document.getElementById("longitude").value = longiPedido de Geolocalização negado pelo usuário."
break;
}
functioncase showError(error)error.POSITION_UNAVAILABLE:
{
doc.innerHTML="Informação switch(error.code)
de localização não está disponível."
{break;
case error.PERMISSION_DENIEDTIMEOUT:
doc.innerHTML="PedidoSolicitação de Geolocalização negado pelo usuário localização não retornou em tempo hábil (timeout)."
break;
case error.POSITIONUNKNOWN_UNAVAILABLEERROR:
doc.innerHTML="Informação de localização não está disponívelErro desconhecido."
break;
case error.TIMEOUT:
doc.innerHTML="Solicitação de localização não retornou em tempo hábil (timeout)."
break;
case error.UNKNOWN_ERROR:
doc.innerHTML="Erro desconhecido."
break;
}
} |
|
|
- Para baixar um exemplo de formulário com geolocalização clique aqui.
Informações |
---|
Veja o exemplo (form-mobile-waze) em nosso repositório aqui. |
Nota |
---|
|
Esta técnica só funciona em ambiente HTTPS a partir do Android 6.0 e iOS 10.
Dica |
---|
|
Para baixar um exemplo de formulário com geolocalização clique aqui. |
Informações |
---|
Veja o exemplo (form-mobile-waze) em nosso repositório aqui. |
Nota |
---|
|
Esta técnica funciona apenas em ambiente HTTPS a partir do Android 6.0 e iOS 10. |
Explorando o input file no mobile
...
É possível manipular arquivos diretamente do formulário mobile através do input file, onde no aplicativo mobile é possível acessar arquivos do dispositivo ou incluir uma imagem diretamente da câmera. Importante observar que ao escolher um ou mais arquivos através desse componente, esses arquivos
não serão anexados à solicitação em questão, uma vez que essa funcionalidade é exclusiva do recurso showCamera descrito nessa documentação.
Bloco de código |
---|
title | Exemplo de implementação |
---|
|
<input type="file" id="btUpload" name="btUpload" title="Arquivos" accept="image/*" class="btn btn-primary" multiple> |
Um ponto para observar é que, ao realizar o upload direto da câmera, não é possível adicionar várias fotos simultaneamente, mesmo quando o parâmetro 'multiple' é especificado, sendo este um comportamento do próprio sistema operacional. O cenário de múltiplo upload pode ser realizado acessando os
arquivos já existentes do dispositivo.
Deck of Cards |
---|
|
Card |
---|
id | 1 |
---|
label | Veja o recurso na prática |
---|
| Image Added
|
|
Formulário único
...
A partir da atualização 1.5 do Fluig Plataforma os formulários da web e do mobile devem ser criados de forma única. Sendo assim, o formulário deve atender tanto o mobile quanto a web.
...
- Download de anexos: este procedimento será automático, porém apenas os anexos do formulário são baixados.
- Download de anexos em processos offline: durante o download dos processos offline os anexos do formulário são baixados e estarão disponíveis para utilização de maneira offline.
Nota |
---|
|
- Para o funcionamento de anexos do formulário, o caminho dos arquivos devem ser relativos e não podem ser externos.
|
Nota |
---|
|
- No sistema operacional Android não é recomendado carregar anexos do formulário via requisições como XMLHttpRequest. O carregamento do conteúdo de arquivos via caminhos relativos já é suficiente.
|
Dica |
---|
|
Recomendamos a leitura da documentação Eventos de formulários na seção das funções getAttachments e sendAttachments. Referentes ao retorno e envio das informações dos anexos. |
Guia de estilos off-line
...
Agora é possível utilizar o guia de estilos em modo off-line sem a necessidade de qualquer conexão a internet, ficou bem mais fácil e independente personalizar seu formulário para processo off-line. Uma vez ao dia o Fluig Mobile ira verificar novas atualizações, caso alguma atualização esteja disponível, o download da mesma será feita automaticamente de forma rápida e transparente, sem precisar se atentar a formas manuais e demoradas para atualização. O guia de estilos off-line está disponível tanto para Android como para IOS.
...