Add to Visual Task Board – Any record (List context)

In a previous article, I explored the possibility of adding any record to a Visual Task Board from a form.

So the next obvious step is to try to do the same in the list view.

Will it be possible to do that? (Spoiler alert: Yes!)

The idea

We can use Personal tasks [vtb_task] as an interface between the VTB Card [vtb_card] and the actual record

Instead of:

VTB Card [vtb_card] → Target record [task]

We can have:

VTB Card [vtb_card] → Personal Task [vtb_task] → Target record [any record in the system]

The code

How do we do that?

With a single UI Action and relying on the out of the box functionality.

Create a new Global UI action (easier if you just copy the OOTB one “Add to Visual Task Board”).

Name: Add to VTB (non-task)

Type: List context menu.

Action name: add_to_vtb_list_context_menu_non_task


Code language: JavaScript (javascript)


Code language: JavaScript (javascript)


function openAddToBoardDialogListContext() {
	//var taskSysID = rowSysId; //We won't use the selected record as the target record
	var tableName = g_list.getTableName();
	var gr = new GlideRecord('vtb_task');//TODO: Replace the Client-side GlideRecord
	var shortDescription = g_list.getCell(rowSysId,'short_description') || g_list.getCell(rowSysId,'name') || g_list.getCell(rowSysId,'number');
	shortDescription = shortDescription ? shortDescription.innerText : 'No short description defined';
	gr.short_description = shortDescription;
	var taskSysID = gr.insert();
	var grVTBComment = new GlideRecord('sys_journal_field'); = 'vtb_task';
	grVTBComment.element = 'comments';
	grVTBComment.element_id = taskSysID;
	grVTBComment.value = '[code]<a href="' + tableName + '.do?sys_id=' + rowSysId + '" target="_blank">' + shortDescription + '</a>[/code]';
	//The code below is exactly the same that you can find in the OOTB "Add to Visual Task Board" UI Action
var o = new GlideOverlay({
		title : "Choose a Visual Task board",
		iframe : "$" + taskSysID + "&sysparm_table_name=" + tableName + "&sysparm_nostack",
			allowOverflowX : true,
		height : 1000,
		width : 2000,
		messages : "",
		onAfterLoad: function() {
	o.setPreference("sysparm_record_id", typeof rowSysId == 'undefined' ? taskSysID : rowSysId);
	o.setPreference("sysparm_table_name", tableName);

function displayMessageStashListContext() {
	if (!this.getData("messages"))
	var m = this.getData("messages");
    if ( {
		for(var i = 0; i <; i++) {
			var msg =[i];
				addFormMessage(msg, "info", 0);
	if (m.messages.error) {
		for(var i = 0; i < m.messages.error.length; i++) {
			var msg = m.messages.error[i];
				addFormMessage(msg, "error", 0);

function addFormMessage(msg, type, id) {
	    GlideUI.get().addOutputMessage({msg: msg, type: type, id: id});
		var scrollDiv = getFormContentParent();
		scrollDiv.scrollTop = 0;

Code language: JavaScript (javascript)


Now, we can add anything to a board.

Why don’t we use our newly created UI Action to test itself?

1 thought on “Add to Visual Task Board – Any record (List context)”

  1. Pingback: Add to Visual Task Board – Any record (List choice) (single-card) » Ruben Ferrero

Comments are closed.