Layout CSS issues when using allowAddMore = true

Hi Bahmni team,

While looking into this thread, I tried configuring some observations in my “conceptSetUI” configuration using the “allowAddMore=true” setting. The resulting view appears as though it needs a bit of CSS help,

Some suggestions:

  • Don’t repeat the name of the question (“Patient category”) on each row
  • Keep the “x” on the same row as the selector widget

Interested in thoughts or if I’m using this incorrectly. Thanks @darius / @vinay / @bharatak, etc

Mike

Hi Mike, Not sure if this is on the Visit details page (Registration 2nd page). If so, my guess is this is similar to issue mentioned here Data doesn't appear correctly on VISIT form and we have looked into this. If the need is to have a multi select option, currently in bahmni, the best way is to configure it as coded concept instead of a dropdown/autocomplete and configure it to be a multi select. (With reference to the above css issue, we have fixed this to have the buttons displayed in a 2 column layout) But i do understand that we could have better options to support multiselect as part of say a dropddown/autocomplete fields which would be more usable in terms of user experience and the ui layout. Thanks for the feedback & we will have a look at this.

Hi @sushma,

Thanks for the response on this. A couple of comments:

  • I manually patched my bahmniapps code with the fix you highlighted (assuming it was simply this commit) before taking the screenshot shown above, so I fear that this will remain an issue after that fix. Were you not able to reproduce this yourself?

  • I’m not sure I’d agree that in order to have a multi-select option, the best way is to configure it is as a button-select, if this is what you are suggesting. Perhaps it is the least buggy option currently. But if a question has several dozen (or several hundred!) possible coded answers, I can’t really see making the recommendation to lay these out as one selectable button per coded answer :slight_smile:

Thanks very much for looking into this and seeing if there are quick fixes that could improve the look and feel of this.

Cheers, Mike

Hi @Mike, Though the commit you pointed was the one supposed to fix the layout issue, while testing we found that the issue you pointed out still exists…and we have looked into this yesterday. This would be tested and released as part of 0.81 patch as mentioned earlier. On the multi select option, sorry if my comments were not very clear. I was referring to the current option available in bahmni which supports multi select in a more neater way is having it configured as buttons select. But i do understand this is not the best option as it’s not feasible to have this when the coded ans are plenty in number. So i was suggesting that we would have to come up with better options such as supporting multi select as part of dropdown/autocomplete or something similar which will help solve this use case. Thanks for you inputs.

Thanks @sushma, great that you’ve found these issues and will get them into 0.81! Thanks for looking further into that for us.

Not to belabor the point, but just to clarify. When you write:

These options do already exist, correct? Because I am able to configure things as above, by using both:

“dropdown”: true, “allowAddMore”: true

Is this just something I stumbled across that happened to kind-of-work, but isn’t supported, or is it intended to work like this? I was hoping that this is supported and we just need to clean it up a bit as I suggest above.

Thanks, Mike

Hi Mike, What i meant from my suggestion is being able to configure a single field (say a autocomplete or something else) which would allow user to multi select values without having to use “AddMore” option. Currently this option is not available and i feel we could have a support for this.

Using “addMore” for such usecase would mean that one would see repeat of the same fields which might be bit confusing for the user and we might have to work on some of the aspects you mentioned here to make it more intuitive.

As i understand, the intent or use case for using “allowAddMore” would be in cases where one needs to capture the same set of information but with different data. for e.g: Capturing data for a new born. In case of say twins, one would configure “addMore” option against the concept set (which captures data like height, weight, gender etc) to add data for both.

Hello friends, have challange understanding how the “allowAddmore” works especially with the aspect of replicating forms. I used the code and seem not to see the addmore button at the top right corner of the form: Sample config to add to clinical/app.json
“config” : { “conceptSetUI”: { “Adverse Events Template”: { “allowAddMore”: true } } } Could it be possible to provide a solution for modify, delete buttons for every form?