Em breveO que são as marcações?
Você pode customizar o seu formulário HTML para registrar consentimentos sem precisar programar, basta usar marcações no código.
Passo 1 - Premissa
| Info |
|---|
Você deve importar no seu código-fonte o SDK Javascript “sdkconsent.min.js” |
| Code Block | ||
|---|---|---|
| ||
<script src="https://cdn.privacytools.com.br/sdkconsent/dist/sdkconsent.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://cdn.privacytools.com.br/sdkconsent/dist/sdkconsent.css" type="text/css" /> |
Passo 2 - Considere o HTML de um formulário comum abaixo.
Você precisará colocar apenas algumas marcações para indicar para o SDK o que fazer.
...
| Code Block | ||
|---|---|---|
| ||
<form id="form-checkbox" action="#" method="post" data-consent-submit>
<input type="hidden" data-consent-user value="hashdousuario"/>
<table>
<tr>
<td width="200px">
Nome
</td>
<td>
<input type="text" data-consent-property name="name" width="200px"/>
</td>
</tr>
<tr>
<td>
Email
</td>
<td>
<input type="email" data-consent-property name="email" width="200px"/>
</td>
</tr>
<tr>
<td>
Cidade
</td>
<td>
<input type="text" data-consent-property name="city" width="200px"/>
</td>
</tr>
<tr>
<td colspan="2">
<input type="checkbox" name="accept" value="yes"
data-consent-reason="hashtemplate"
/>
Gostaria de receber emails promocionais
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="Enviar"/>
</td>
</tr>
</table>
</form> |
Tabela de Marcações
Marcação | Onde usar | Para que serve |
|---|---|---|
data-consent-submit (recomendado, mas opcional se usar a chamada manual conforme instruções no final desta página) | Na sua tag <form> | O SDK vai criar uma chamada no “onsubmit” do seu formulário para poder registrar o consentimento antes de submeter o formulário. Caso o seu código já tenha uma declaração “onsubmit” o sistema vai guardar essa declaração e invoca-la ao final do registro do consentimento. Caso você não possa sobrescrevê-la, leia no final da página. |
data-consent-user (obrigatório) | Crie um campo “hidden” dentro do seu formulário <input type=”hidden” data-consent-user value=”hash do seu usuário”/> | Você precisa enviar o hashUser do usuário que você está registrando consentimento. Sem este hashUser ele não vai funcionar. |
data-consent-reason (obrigatório pelo menos 1) | Em um ou mais checkboxes ou combos de seleção. No caso de checkbox o sistema vai interpretar o checkbox marcado como “sim” e desmarcado como “não” No caso de comboboxes ele vai interpretar qualquer valor abaixo como NÃO, caso contrário será SIM.
| Em um formulário você pode coletar o consentimento para várias finalidades. Cada checkbox ou combo deve ser vinculada com uma finalidade. Obtenha o hash da sua finalidade e coloque como uma marcação diretamente no checkbox ou combo. Exemplo: <checkbox data-consent-reason=”hash da finalidade… > ou <select data-consent-reason=”hash da finalidade” ..> |
data-consent-property (opcional) | Coloque esta marcação em cada dado pessoal do formulário que você quiser gravar. Para os dados pessoais abaixo o sistema possui campos ja pré-definidos. Caso o dado pessoal não seja nenhum destes abaixo ele entrará como um metadado da pessoa.
| Muitas vezes o formulário vai coletar outros dados pessoais que você quer vincular com a pessoa através do hash. Utilize esta propriedade opcional para este vínculo. |
Como obtenho o consentHash?
O consentHash é o hash que representa cada consentimento salvo - é como o “recibo” do consentimento. Quando o SDK registra o consentimento através do formulário ele cria de volta um campo “hidden” com o name “data-consent-hash” no seu HTML. Caso ocorra algum erro ele vai criar o campo “hidden” com o name “data-consent-error” no seu HTML.
Estes campos você pode capturar no seu sistema após o submit do seu formulário.
Não quero sobrescrever o ‘onsubmit’
Caso o seu código não possa sobrescrever o onsubmit você precisará chamar a função de gravação manualmente seguindo as instruções abaixo.
| Code Block |
|---|
/**
A variável "sdk" é a sua referência para o SDK criada no início.
A referência "myForm" deve referenciar o seu formulário (ex: document.forms[0])
*/
sdk.registerFormConsents(myForm, function (consentHash) {
//faz alguma coisa com o recibo de sucesso do consentimento
//faça o seu submit
},function(error){
//faça alguma coisa com o erro de registro de consentimento
});
|
Pronto, neste caso você vai fazer a chamada manual.