0

I have a table that lists out invoices and their details. In this table, the user is able to select multiple invoices and pay selected ones all together. In its current state, we only list out "Open" (ie, unpaid) invoices.

We want to add a "Status" column so the user is able to see all their other invoices including "Paid" and "Voided" ones.

Obviously, the checkboxes aren't going to work anymore because it's tied to the "Pay" button, and it doesn't make sense to be able to select (and attempt to pay) non-open invoices.

enter image description here

What's the best way to go about this?

Solution 1: Omit checkboxes from non-open invoices - ie, only open invoices have the checkbox

Solution 2: Non-open invoices should be in their own separate table in a separate tab - ie, there will be separate tabs for (Open invoices, Paid, and Voided). Although I think the user should be able to see all their invoices in one page vs separate tabs.

Improve this question
4
  • I like Solution 1. Can people filter the list for only open invoices? I think that's important too.
    – bloodyKnuckles
    Commented Feb 21, 2023 at 23:22
  • A related suggestion. When the list is showing various status items, de-emphasize the "Pay invoice" button—not dim nor disable, but lose the blue background, make text black-ish, and just blue border. When only open invoices are listed pop it out.
    – bloodyKnuckles
    Commented Feb 21, 2023 at 23:24
  • @Glorfindel No, that's a similar question I posted. Had to update it. I requested this question to be closed as the other one supersedes it.
    – M Bo
    Commented Feb 23, 2023 at 20:52
  • Does this answer your question? Multi-select for table with invoices that can have different statuses
    – Izquierdo
    Commented Mar 2, 2023 at 21:51

1 Answer 1

Reset to default
1

Always start thinking about the user's end goal. In this situation, the primary goal is to pay one or multiple open invoices.

To help your users achieve this goal, you'll want to first break down the problem by omitting things they're not interesting in. This means creating a filter where the user can the invoices based on status (All / Paid / Open / Void). In this situation, it's more likely that they'll only see the open invoices and then they can use the button.

You'll want to disable the check-boxes in any row with invoices that are not open. And also label the column for the check-boxes something along the lines of "Select for payment".

I'd also suggest relabelling the button to "Pay selected invoices {number of items selected}" for clarity.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.