Question

I have two functions, one that creates a table like so:

function return_formatted_results(result_no,addy,title,own_comment)
        {
var div=document.createElement("DIV");
attr(div, 'id', 'div_id'+result_no);

var form=document.createElement("FORM");
attr(form, 'id', 'det_'+result_no);
attr(form, 'name', 'form'+result_no);
attr(form, 'method', 'post');
attr(form, 'action', '');

// ###############
// add all other objects and attributes here
// ###################

form.appendChild(table);
div.appendChild(form);
}

and then I have this function that calls the above function:

    function get_urls_and_display()
    {


        var allTables=new Array();

        for(var i=0;i<url.length;i++)
{   allTables[i]=return_formatted_results(i,url[i],the_title[i],the_comm[i]);   }

        document.getElementById("wait").appendChild(allTables.join("\n\n"));

The problem is the join() in the last line throws an error. I am new to working with the whole DOM thing like I did above, so have no idea what to use instead. I used to use plain html before and join() worked then.

Thanks!

Answer 1

You’ve got a few problems:

1. return_formatted_results doesn’t actually return anything (ironic because it’s explicitly stated in the name)
2. join is indeed only for strings.

After you make return_formatted_results return div, try this for get_urls_and_display:

function get_urls_and_display() {
    var wait=document.getElementById("wait");
    for(var i=0; i<url.length; i++) {
        var div=return_formatted_results(i, url[i], the_title[i], the_comm[i]);
        wait.appendChild(div);
    }
}

Additionally, it looks like you have three different arrays all containing related data. A more suitable data structure would be a list of objects. You could define that like this:

var data=[
    {
        url: "http://www.example.com/a",
        title: "Link A",
        comment: "This is the first link."
    },
    {
        url: "http://www.example.com/b",
        title: "Link B",
        comment: "This is the second link."
    }
    // ...
];

Here’s what get_urls_and_display would look like with that:

function get_urls_and_display() {
    var wait=document.getElementById("wait");
    for(var i=0; i<data.length; i++) {
        var datum=data[i];
        var div=return_formatted_results(i, datum.url, datum.title, datum.comment);
        wait.appendChild(div);
    }
}