Popup child incident record details in table format on click on UI Action

[Ganeshm1]

Hi All,

I have a requirement to show child record details in table format on click on custom UI Action "Show child Incident" on incident table.
I have created below script but its not working as expected. Could you please help me on this.

Below are the UI Action details
Name: Show child incident

Client: true

Form button: true

Onclick: showChildTableDataPopup();

script:

function showChildTableDataPopup() {
    // Get the current record (parent record)
    var currentRecord = g_form.getValue('sys_id');

    // Build the GlideRecord object for the child table
    var grChildTable = new GlideRecord('incident');

    // Set the filter to match the related field on the parent table
    grChildTable.addQuery('parent', currentRecord);
    grChildTable.setLimit();

    // Execute the query
    grChildTable.query();

    // Build the popup content (consider error handling)
    var popupContent = buildPopupContent(grChildTable);
    if (!popupContent) {
        alert('No child records found.');
        return;
    }

    // Create and display the popup
    var popup = createPopup(popupContent);
    popup.show();
}

function buildPopupContent(grChildTable) {
    // Build table header row
    var tableHtml = '<table><thead><tr>';
    tableHtml += '<th>Name</th><th>Description</th></tr></thead><tbody>';

    while (grChildTable.next()) {
        var childName = grChildTable.name;
        var childDescription = grChildTable.description;

        // Build table row for each child record
        tableHtml += '<tr><td>' + childName + '</td><td>' + childDescription + '</td></tr>';
    }

    tableHtml += '</tbody></table>';
    return tableHtml;
}

function createPopup(content) {
    // Create a basic popup element using jQuery
    var popup = $('<div class="child-table-popup">' + content + '</div>');

    // Add a close button (optional) with functionality
    popup.append('<button class="close-popup">Close</button>');
    $('.close-popup').click(function() {
        popup.hide();
    });

    // Apply basic styling (optional)
    popup.css({
        'position': 'fixed',
        'top': '50%',
        'left': '50%',
        'transform': 'translate(-50%, -50%)',
        'background-color': 'white',
        'border': '1px solid #ddd',
        'padding': '10px',
        'z-index': 100 // Ensure popup is above other elements
    });

    return popup;
}

Thank you in advance. 

Regards,

Ganesh 

[Sohail Khilji]

Hi @Ganeshm1 ,

why popup ? you can rather show the child incidents in the realted incident.  go to relationship module and create a relationship to show all child incident.

There script that your using seems like a AI genrated which will never work in servicenow space. 

[Ganeshm1]

Hello @Sohail Khilji : Thank you for your reply.
Actually with respect to my requirement, I am not dealing with child incident records. I am dealing with Batch CIs where its having a related list called Teams and its storing the different level of assignment groups. 

To explain it in easy way I modified the requirement in the question. Please let me know if you have any input on this. Thank You!

[Sohail Khilji]

can you share exactly on what your requirement is ?

[Community Alums]

You should not use DOM manipulation here. Note that your selectors will fail soon enough - may be next upgrade or 2 from now, but this will fail (if it's working at all, for which I can say it's not).

You need to use GlideDialogWindow/ GlideModal or similar where you call respective UI Page/Macro and pass your params to these where backend logic + presentation is done.

If for fun - such way is somehow acceptable on your PDI to test something. For production instances this is absolutely not acceptable and will bring lots of issues sooner than later.