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?
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':
adminCount++;
break;
case 'Viewer':
viewerCount++;
break;
case 'Editor':
editorCount++;
break;
}
});
// Check if the selection criteria are met
const isValidSelection = (
adminCount === 1 &&
viewerCount <= 2 &&
editorCount <= 10
);
// Return the result
return isValidSelection;
