Listing values from vlookup table in html header

[Phil Grant]

Hi,
I have used an HTML header to create a table to summarize some information for a record and I would like to to display a list of items from a vlookuptable linked to the record. This works fine when I use a normal field in a tab and it loads the child records but I would like to include the child data inside an HTML table.

Is this possible?

Cheers,
Phil

[Alexander Bautz]

You would have to use custom js to read the values from the vLookup data object and write them to your table – something like this.

Add this to your HTML section:

<table id="vLookup_data_placeholder">
<tr ><th>ID</th><th>Title</th><th>Created</th></tr>
</table>

And add this to your Custom JS – replace “vLookupTasks” with the internal name of your vLookup field:

function vLookupIsLoadedCallback(fin) {
    if (fin === "vLookupTasks") {
        var b = "";
        jQuery.each(spjs.vLookup.dataObj[fin][spjs.dffs.data.thisItemID].items, function(i, item){
            b = "<tr id='vLookup_custom_row_"+item.ID+"'><td>"+item.ID+"</td><td>"+item.Title+"</td><td>"+item.Created+"</td></tr>";
            if(jQuery("#vLookup_custom_row_"+item.ID).length > 0){
                // Row already exist - replace
                jQuery("#vLookup_custom_row_"+item.ID).replaceWith(b);
            }else{
                // Row not found - appending to table
                jQuery("#vLookup_data_placeholder").append(b);
            }
        });
    }
}

Alexander

[Phil Grant]

Thanks Alexander I’ll give it a try.

[Phil Grant]

I have got this working….. sort of, the HTML table will populate with the lookup data but only if the lookup field is added to the Tab normally, with the normal field added to the tab the HTML table populates with the child values but if I remove the normal field then the HTML table stops populating.

Is this something to do with the triggering of the function only happening if the normal vlookup field is on the tab?

Cheers,
Phil

[Alexander Bautz]

Hi,
Yes, vLookups are lazy-loaded and does not exist in the form until you make it visible on a tab.

If you wanted to show the input on a custom HTML table and not loading the vLookup you basically need to write a manual query to fetch the vLookup data and then write it to your custom HTML table.

Alexander

[Phil Grant]

DOH!

[Author]

Posts