Dynamic text - changing text in html5

Hi.

As there some things that I don't understand in your file, I created a simple sample that i hope will help you to get started.

Javascript:

// The SheeJS library is included in the 'Include' section to the left
// https://cdn.sheetjs.com/xlsx-0.19.2/package/dist/xlsx.full.min.js

var xlsxFileName = "test.xlsx";
var sheetName = "Sheet1"; // you can get this name from the console.log(workbook) call below
var rows = [ "1", "2" ];
var targetTextFieldsContainers;

function main()
{
	root.stop();
	targetTextFieldsContainers = [ root.tf0, root.tf1, root.tf2, root.tf3, root.tf4 ];
	readXLSX(xlsxFileName, onXLSXLoaded, { sheetName: sheetName, rows: rows });
}

function readXLSX(src, callback, props)
{
	var req = new XMLHttpRequest();
	var textFields = [];
	var texts = [];
	var data = [];
	var i;

	req.open("GET", src, true);
	req.responseType = "arraybuffer";

	req.onload = function(e)
	{
		var workbook = XLSX.read(req.response);
		var worksheet = workbook.Sheets[props.sheetName];
		var key;
		
		console.log(workbook);
		console.log(worksheet);

		for (key in worksheet)
		{
			if (key.indexOf(props.rows[0]) > -1)
				textFields.push(worksheet[key].h);

			if (key.indexOf(props.rows[1]) > -1)
				texts.push(worksheet[key].h);
		}

		for (i = 0; i < textFields.length; i++)
			data[i] = { tf: textFields[i], text: texts[i] };

		callback(data);
	};

	req.send();
}

function onXLSXLoaded(data)
{
	console.log(data);
	
	data.forEach(function(item)
	{
		if (targetTextFieldsContainers.indexOf(root[item.tf]) > -1)
			root[item.tf].tf.text = item.text;
	});

	stackTextFields(targetTextFieldsContainers);
}

function stackTextFields(targets)
{
	targets.forEach(function(tf, index, array)
	{
		var currentHeightOffset = tf.tf.getMeasuredHeight() * 0.5;
		
		tf.tf.y = -currentHeightOffset;
		
		if (index > 0)
		{
			var previousTF = array[index - 1];
			tf.y = previousTF.y + previousTF.tf.getMeasuredHeight() * 0.5 + currentHeightOffset;
		}
	});
}

if (!this.looped)
{
	window.root = this;
	main();
	root.looped = 1;
}

In your case the sheet name is Tabelle1.

Source / files / FLA / code:
https://bit.ly/3DW426o

I hope it helps.

Regards,
JC

Hi.

I think I don't get it.

In the sample you provided, there's a table that uses regular DOM texts, right? And the table seems to be looking correctly.

So exactly what do you want to do in that preview? And can you show us the code you have in Animate now?

Regards,

JC