I am required to insert text inside the first leftmost row of a table, which comes in a Matrix question type in Limesurvey.
This is not originally possible right from the admin panel. I have figured out to insert javascript code.
Inspecting the table, unfortunately, that first row doesn't have neither a class nor an id to select it directly.
This is how I have managed to get that first <td>
inside the <thead>
:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
console.log("test");
//Seleccionar la tabla correspondiente
var t = document.querySelector('[aria-labelledby="ls-question-text-852216X2X7"]');
d = t.getElementsByTagName("tr")[0],
r = d.getElementsByTagName("td")[0];
var td = $(t).find("thead td").eq(0).children().first();
console.log(td);
//td.innerHTML = "mytext";
});
</script>
However, I don't know how to insert the text inside that cell. I have tried the innerHTML()
function but it's not working.
The result of console.log(td)
is the following object:
Object { length: 0, prevObject: {…} }
length: 0
prevObject: Object { length: 0, prevObject: {…} }
length: 0
prevObject: Object { 0: td
, length: 1, prevObject: {…} }
0: <td class="">
length: 1
prevObject: Object { 0: td, length: 1, prevObject: {…} }
From that object, I see the element of interest: 0: <td class="">
, then how do I do to insert the desired text just there?
Thanks to @wazz I could solve it.
So I select the table:
var t = document.querySelector('[aria-labelledby="ls-question-text-852216X2X7"]');
and then I finally insert the text:
t.rows[0].cells[0].innerHTML = "text";
I can't tell if there's an ID on your table (var t
I think.) If there is, it should be straightforward. Does this work?
document.getElementById("myTable").rows[0].cells[0].innerHTML = "text";
That gets the first cell of the first row. If there's a table-header, it will get the first cell of the header (header is included), so adjust the row as needed.