I've been debugging for some time, trying to get the value of a column in a table. I think once I've done this, it should be easy to pass the value in the next column out of my JS function.
My HTML table is:
<table id="country_LE_table" style = "display:none">
<tr>
<td>Japan</td>
<td>83.7</td>
</tr>
<tr>
<td>Switzerland</td>
<td>83.4</td>
</tr>
</table>
My Javascript is:
<script type="text/javascript">
function getLifeExpectancy() {
var Country = "<?php echo $Country ?>";
document.write(Country); // this gets read OK
var table = document.getElementById("country_LE_table");
var tr = table.getElementsByTagName("tr");
document.write(tr.length); document.write("<br>"); // works as expected
for (var i = 0; i < tr.length; i++) {
document.write(tr[i].innerHTML); document.write("<br>"); // works well up to here
// the following doesn't work
var td = tr[i].getElementsByTagName("td")[0];
if (td = Country) { //need td.fullHTML/value/fullText?
return tr[i].getElementsByTagName("td")[1]; // return the number
}
document.getElementById("demo").innerHTML = getLifeExpectancy();
</script>
If I do document.write(td), I get "[object HTMLTableCellElement]" on my page.
If I do document.write(td.fullHTML) I get "undefined" on my page.
When I explore other methods than td.innerHTML, I get this - it looks like I can't use functions based around text.
Use this instead. you have used assignment operator instead of comparison operator "=="
if (td.innerHTML == Country)
{
}
I am passing arraylist object to javascript function on the click on button.below is my code. But I am unable to iterate that list in javascript.
<input type="button" onclick="viewSelectedOU('${quickLink.orgList}')" class="btn" value="view"/>
<script type="text/javascript">
function viewSelectedOU(selectedOU){
for(var i=0; i<selectedOU.length; i++){
var orgList1 = selectedOU[i];
}
}
</script>
can anyone tell me how to iterate java.util.ArrayList into javascript.?
check your rendered page, it shoud be something like onclick="viewSelectedOU([1,2,3,4])"
here is example of 2 calls:
http://jsfiddle.net/ybigus/K6CUm/
Test simple array
Test object array
Hope this helps
you can try
for(var i=0;i<selectedOU.all.length; i++){
var value = selectedOU.all(i);
}
Playing with a quick concept. Hopefully the answer is pretty simple, my attempt is just failing here for some reason.
Let's say I have an array such as:
var items = [[1,2,3],[4,5,6],[7,8,9],[10,11,12]];
And I'm trying to flip the data around, so it converts it into:
var items_converted = [[1,4,7,10],[2,5,8,11],[3,6,9,12]];
This much is completed. Now, with my new multidimensional array, I want to push each internal array's contents to an HTML table row:
<tr>
<td>1</td>
<td>4</td>
<td>7</td>
<td>10</td>
</tr>
<tr>
<td>...
Play here: http://jsfiddle.net/XDFd2/
I tried doing it with two for-loops, but it doesn't seem to be appending the <tr> or </tr>.
var items = [[1,2,3],[4,5,6],[7,8,9],[10,11,12]];
var items_converted = [[1,4,7,10],[2,5,8,11],[3,6,9,12]];
var table = $('#table');
for(var i=0; i<items_converted.length; i++){
if(i==0){
table.append('<tr>');
}
for(var j=0; j<items_converted[i].length; j++){
table.append('<td>'+items_converted[i][j]+'</td>');
if(j===items_converted[0].length-1){
table.append('</tr');
}
}
}
I feel I'm missing something very simple here... perhaps the order that the loops are processing?
Any help is appreciated.
Play here: http://jsfiddle.net/XDFd2/
You're trying to use append() like document.write(). That's a wrong approach. You should look at the DOM starting at your table node and append nodes for each row and cell.
Basically a $('<tr>') to create a row, followed by an table.append() call to add it to the DOM. Likewise for the cells.
var items = [[1,2,3],[4,5,6],[7,8,9],[10,11,12]];
var items_converted = [[1,4,7,10],[2,5,8,11],[3,6,9,12]];
var table = $('#table');
var row, cell;
for(var i=0; i<items_converted.length; i++){
row = $( '<tr />' );
table.append( row );
for(var j=0; j<items_converted[i].length; j++){
cell = $('<td>'+items_converted[i][j]+'</td>')
row.append( cell );
}
}
Fiddle
i have a problem with my javascript and html
i was trying to write a html element using a function from my javascript
here's my code
function write();
{
for(var i=0;i<arr.length;i++)
{
document.write("<td>"+arr[i]+"</td><br>")
}
}
and code at my index.html, i want put that write inside my table row
<tr>
<script>write();</script>
</tr>
i have attached my javscript to my html document, but nothing happened
can u guys help me to put make that function work??
thanks guys!!
As per your question description, for writing html or dom elements say, you need to first create element(until you already have in which case you can use document.getElementById()) and then add text.
For creating:
# Create new dom element
var td = document.createElement("td");
Adding text:
td.appendChild(document.createTextNode('hiii'))
In your case:
function write(){
var element;
for(var i=0;i<arr.length;i++) {
element = document.createElement("td");
element.appendChild(document.createTextNode(arr[i]));
}
}
Give your row an id like this:
<tr id="myRow">
</tr>
Also i would recommend you to implement the function call in your javascript file.
Try something like this:
window.onload = function(){
write();
};
function write(){
for(var i = 0; i < arr.length; i++){
document.getElementById("myRow").innerHTML += "<td>" + arr[i] + "</td><br>";
}
}
you can check html below:
<table>
<tr id="myid" >
</tr>
</table>
and javascript would be like this
var row = document.getElementById("myid");
var x = row.insertCell(0);
x.innerHTML="New cell";
HTML:
<table>
<tr id='row'></tr>
</table>
JS:
function write(arr) {
var row = '';
for (var i = 0; i < arr.length; i++) {
row += '<td>'+arr[i]+'</td>'
}
document.getElementById('row').innerHTML = row;
}
write(['a', 'b', 'c', 'd']);
working demo: http://jsfiddle.net/uhaEL/
I am trying to populate an HTML table using the JSON string retrieved from a $.getJSON() call. The $.getJSON() call is working fine. But I am not able to populate an html table with the retrieved json data. Please help me with my code..I'm new to this..
function loadTable(result){
if(result.groups="no"){
var num_rows = result.noofteams;
var rows = "";
for(var i=0;i<num_rows;i++){
rows +='<tr>'+result.noofteams+'</tr>';
}
$("#container").append(rows);
Here result is the json object that i am receiving. result.noofteams is giving proper value (i have checked it). But the problem is, i am unable to populate #container with result.noofteams Please help..
u used = while u need == or === for conditions
function loadTable(result){
if(result.groups==="no"){
var num_rows = result.noofteams;
var rows = "";
for(var i=0;i<num_rows;i++){
rows +='<tr><td>'+result.noofteams+'</td></tr>';
}
$("#container").append(rows);
}
}
EDIT: Add <td> they are important as well
It's much cleaner to work with JSON like so...
for (i in result) {
rows += '<tr>' + result[i]['noofteams'] + '</tr>';
}