Coletar e modificar dados em um form

Boa tarde Pessoal,
estou com uma duvida no meu projeto, estou querendo usar formulários para mostrar dados e poder altera-los também, mas minha duvida está como faço para integrar o html ao datapoint do scada?

uma imagem de como está, para ficar mais fácil entender oque estou querendo

Existem várias formas de integrar os valores de datapoints com elementos HTML. JSP eu acho que permite fazer isso, além dos scripts para servidor, que é o que eu costumo usar. A maior desvantagem do script para servidor é que você tem que criar os elementos HTML através de uma string (cadeia de caracteres), o que torna difícil criar formulários longos.

Eu criei uma “gambiarra” que permite integrar melhor os dados de um script para servidor com os componentes HTML. Ainda não está perfeita, mas vou compartilhar porque pode ser útil.

Primeiramente, você deve criar um componente script para servidor para cada datapoint a ser controlado e inserido no formulário. Em todos esses componentes, insira o seguinte código:

// ID único para o elemento. Deixe vazio para usar o XID
var id_zumbi = "";
// Exibe ou oculta o nome do zumbi
var invisivel = false;

// NÃO ALTERE A PARTIR DAQUI

if ((id_zumbi.length == 0) || (typeof id_zumbi == "undefined")) {
	id_zumbi = point.xid;
}

var idZumbi= "zumbi" + id_zumbi;
var comando = "mango.view.setPoint(" + point.id + ", " + pointComponent.id + ", this.value)";

var s = "<input type='hidden' id='" + idZumbi + "' value='" + value + "' onchange='" + comando + "'></input>";

if (invisivel == false) {
	s += "<p><strong> Zumbi " + idZumbi + " (" + point.name + ") </strong></p>";
}

return s;

O código acima serve para transformar o script para servidor em um “zumbi”, controlado por um elemento HTML. O script irá gerar uma tag HTML invisível ( <input type=“hidden”> ) que pode ter seu valor acessado via javascript através do seu id HTML.
(Por padrão, o id HTML associado é formado pela palavra “zumbi” e o XID do datapoint, por exemplo, zumbiDP_392018. Isso pode ser alterado pela variável “id_zumbi” no código)

Uma vez que você criou todos os datapoints zumbis que precisa, você pode inserir um único componente HTML com o código abaixo:

<div style='height: 20px; width: 20px; overflow: hidden;'>
<script>
	function writeZombie(idZombie, value) {
		var concat = "zumbi" + idZombie;
		try {
			var zombie = document.getElementById(concat);
			var changeEvent = new Event('change');
			zombie.value = value;
			zombie.dispatchEvent(changeEvent);
		} catch {
			alert("Elemento não encontrado. Verifique as configurações do 'zumbi'");
		}
	}

	function readZombie(idZombie) {
		var concat = "zumbi" + idZombie;
		try {
			var zombie = document.getElementById(concat);
			return zombie.value;
		} catch {
			alert("Elemento não encontrado. Verifique as configurações do 'zumbi'");
		}
	}
</script>
</div>

Basicamente esse código cria duas funções javascript: readZombie(idZombie) e writeZombie(idZombie, value) para ler e escrever dados no datapoint zumbi, respectivamente. Através delas você poderá puxar os valores para o seu formulário (informando o id do zumbi, sem a palavra “zumbi” no início) e também escrever dados nos datapoints a partir do formulário (informando o id do zumbi, sem a palavra “zumbi” no início, e o valor a ser escrito).

Espero ter ajudado. Qualquer dúvida é só falar.

2 curtidas

Eu vou testar esse método. Se ajudar merece uma estrelinha. hehehe