We are back where we started. Use the row index returned in the webviewstring as the index in the list that you sent to the webviewer html in the first place. Then you can return the data for that row.
It somehow looks like the WebViewStringChange does twice the “value” parameter evaluation in the do-loop;
On the 1st round it returns the row index. On the 2nd round it returns the whole row.
This seems to depend on that whether the data changes; if the data includes the color tag, it returns the whole row data. If not, then it returns only the row index.
Do you have any explanation to this behavior? Because the AppInventor code cannot be the reason.
I am retrieving data frmo database to AppInventor Webviewer component which has been structured with table.html (which is presented in AI2 forum).
What confuses me is that Webviewer WebViewStringChange control’s return parameter “value” sometimes returns the data row index and sometimes the whole data row as comma separated fields.
1st question: is there any explanation for such a behaviour?
2ns: question: currently I have managed in returning always the whole data row only, fields separated with comma. But somehow I havent managed to create another list from that data row by splitting it with comma. My code just ignores the comma separator in split function. Is the comma (,) somehow evaluated separately in AppInventor?? Can anyone help?
I always get the below error. Not sure whether it is also dependent on the style formatting in the table.html?
Sorry I forgot to show this. So the “value” is read to variable “webvalue”.
table.html script block here:
–clip–
// if you have commas inside your text, feel free to use another delimiter, for example var delimiter = “,”;
// get the table to display from the window.AppInventor object and split at new line
var urlArray = window.AppInventor.getWebViewString().split("\n");
//var urlArray = location.search.slice(1).split("/n");
var doc = document;
var fragment = doc.createDocumentFragment();
var thead = doc.createElement("thead");
var tr = doc.createElement("tr");
// split at delimiter
var rowArray = urlArray[0].split(delimiter);
addRow(thead, "th");
fragment.appendChild(thead);
var tbody = doc.createElement("tbody");
for(i=1;i<urlArray.length;i++){
var tr = doc.createElement("tr");
// split at delimiter
var rowArray = urlArray[i].split(delimiter);
tr.addEventListener ("click", function () {
// return picked row (remove td tag, use delimiter and remove last character, http://stackoverflow.com/a/1990274)
//var picked = this.innerHTML.replace(/<td>/g, "").replace(/<\/td>/g, delimiter).replace(/(\s+)?.$/, '');
//window.AppInventor.setWebViewString(picked);
// return index (add 1 because first row is the header row)
//window.document.title = this.rowIndex + 1;
window.AppInventor.setWebViewString(this.rowIndex + 1);
});
addRow(tbody, "td");
}
fragment.appendChild(tbody);
var table = doc.createElement("table");
table.appendChild(fragment);
doc.getElementById("myTable").appendChild(table);
// http://stackoverflow.com/a/9236195/1545993
doc.getElementById("myTable").getElementsByTagName('table')[0].className = "striped";
function addRow(dom, tag) {
for(j=0;j<rowArray.length;j++){
var el = doc.createElement(tag);
el.innerHTML = rowArray[j];
tr.appendChild(el);
dom.appendChild(tr);
Q1. This was probably caused by having both event listeners running at the same time ?
Q2. See the attached aia which is a development of Taifun’s original dynamic table. Replicate/Modify this for your own app.
Change your list to json in Screen1 properties
When the index (row) is picked the value of the row is returned
Use blocks to select the row values, working in a list