Limit row selection to 1 if row has role "PM" and max 4 if Role is "Eng" and show selection in text box?

I need help with multiselect. and limits based on Roles if this is posible?

I have a modal with table listing users, Table has multiple selections.
I have also a form for the table with text fields,

and I have a form with 3 fields that needs to be field out. This will help user to see who user has selected the list


User can only select one user with role "Admin"
User can only select two user with role "Viewer"
User can select 10 users with role "Editor" the text field will have a limit of 255.

The button will have a submit handler that will the store the textfield information as text in to 3 different textfield the table within my db.

I hope that there are some that can help a new beginner?

HI there @Thore,

The way I would approach this is:

  • Change your 3 fields to multiselect fields and map your options with your users information, which I'm assuming you have in a database table
  • If you don't have a users table, then I would highly recommend setting one up, as I would advise storing your users in a jsonb list of ids rather than as a textfield information
  • You can then disable your "Link selected team to project" based on a set of rules. This would be done through a javascript query that returns a true/false result based on the series of rules that you have outlined
  • If disabled, you can hide/show a warning message so that user knows why the button is disabled, e..g "you have selected more than 1 admin"

In any case, if your business requirements need for these fields to be text, you can apply the same rule to the button.

The javascript would look something like:

const selectedRows = table1.selectedRows;

// Initialize counters for each role
let adminCount = 0;
let viewerCount = 0;
let editorCount = 0;

// Loop through the selected rows and count the roles
selectedRows.forEach(row => {
  switch(row.role) {
    case 'Admin':
    case 'Viewer':
    case 'Editor':

// Check if the selection criteria are met
const isValidSelection = (
  adminCount === 1 &&
  viewerCount <= 2 &&
  editorCount <= 10 

// Return the result
return isValidSelection;

Here's a screenshot of how you can set it up

1 Like

Hi. Thanks for the help.

I was wondering if you can tell me how you got the warning to show when the button is disabled?


It could be a text component that is shown conditionally:

1 Like