Add redirects to action link options

There have been many times where I really wished there was an option to redirect the user after clicking an action link.

For example, a user has a message record that’s displayed in a table. Clicking an action link marks the message as read (changes a select field) and then redirects the user to a message details page.


2nd Tims suggestion.

Yes me too. would be great.

Agree, this would be a great option.

I agree, we require such ability within the action links also, it will make life easier.

Until we add this as a native option in Tadabase, I’d like to share a low code solution for this.

I recorded a video explaining how to do this:

JavaScript Code

var actionLinkColumnPosition = 'X';

var setOnClickEventsForActionLinks = function(){
    $('tbody tr').find('td:nth-last-child('+actionLinkColumnPosition+') a').click(function(){
        var recordId = $(this).parents().eq(2).find('.recordId span').html();
        window.location.href = "/APP_NAME/PAGE/DETAILS_PAGE/"+recordId;

TB.render('component_XX', function(data) {
            $('tbody tr').find('td:nth-last-child('+actionLinkColumnPosition+') a').off();

CSS (if you are hiding the record id column)

.filter-tabs+.table-actions {
    border-top: 1px solid #ddd;

This is awesome @Chem! Thanks @tim.young for suggesting this. I was working on something today that needs this functionality, great timing people! :grinning:

1 Like

Thanks Chem, this worked perfectly :smiley:

For my use case, I made a slight edit to append to the existing URL due to IDs used elsewhere:
window.location.href += "/DETAILS_PAGE/"+recordId;

Hey @Chem,

There is something very strange happening with this code. I implemented it on one of my pages but very randomly on other pages if there is an action, or an edit button in the last column it will redirect me to the page that is set in the javascript page.

It is really weird because I only have the javascript on one particular child page but the redirect has been happening on three other separate pages and there is no javascript on those pages. I have been getting around this glitch by adding another column to the end on the tables and hiding it but I thought I’d bring it up to you to see if you know what is going on.

So I am trying just to redirect to the main dashboard of the application once and action link is clicked.
My action link is part of a details component on the page. I am assuming that my need will not require as much set-up per-se to get me back to an existing page within the application.

Expected Outcome:
When action link is clicked it would redirect the current details page back to the main screen or top level parent page.

Hey @bgedevteam

Sure! :smiley: The setup will be exactly the same at first but all you’ll need to do at the end is change the window.location.href value in the JavaScript.

So the following…
should be changed to the URL of the main screen/top level/parent page

For example
window.location.href = ""

So we are using a details component to show an action button vs a table. So what to we remove because there is no table.

1 Like