Skip to main content
stevene0005
April 19, 2023
Solved

Auto-refresh issue on scrolling in dropdown of 100+ choices with 1+ null choice label, on a monitor

  • April 19, 2023
  • 11 replies
  • 0 views

This is an issue that was initially reported on a Site and I could not replicate it when testing in any browser, until I thought to test on a separate monitor (not my laptop screen). When testing on the monitor was able to replicate in Chrome & Edge through the Site, through the top-level parent interface, and through the interface that contained the dropdown (although for the customers instead of a refresh, it was causing the entire page to turn grey). Can only replicate the issue on my laptop screen through the interface, not through the Site. I have reached a resolution for the issue (updating/deleting rows in the database or logic on local!choices to replace nulls with "Unknown") but sharing since I was not able to find anything when I had searched online. Believe the issue was caused by a user deleting some of the data for a couple rows before using the "Delete" icon/button that had been set up.

The case was the query pulling in the data did not have any filters & there were couple similar fields in the database: code, desc, name. The queried data was sorting on the code (always not null) & using the desc (couple nulls) as the Choice Labels (IDs as the Choice Values, all unique integers). Below is some code that can be copy-pasted into a test rule if anyone would like to see what the issue looks like, just need to do the testing on a separate monitor (not your laptop screen).

a!localVariables(
  local!values: enumerate(105),
  local!choices: touniformstring({enumerate(15), "", enumerate(89)}),
  local!selection: null,
  a!sectionLayout(
    contents: a!dropdownField(
      label: "Dropdown",
      placeholder: "-- Select a Value --",
      choiceLabels: local!choices,
      choiceValues: local!values,
      value: local!selection,
      saveInto: local!selection
    )
  )
)

Best answer by stefanhelzle0001

[mention:6b9f80ff18f9420082d13ef2d5121d56:e9ed411860ed4f2ba0265705b8793d05] this seems to be a bug. I attached a video showing the behaviour.

[View:/cfs-file/__key/communityserver-discussions-components-files/13/Bildschirmaufnahme-2023_2D00_04_2D00_20-um-08.09.07.mp4:320:240]

11 replies

gopalk2865
Participating Frequently
April 20, 2023

when you are configuring choice labels and choice values for a dropdown , make sure you have null check for these choices and values. you will not face this error.

stefanhelzle0001
Brainy
April 20, 2023

[mention:6b9f80ff18f9420082d13ef2d5121d56:e9ed411860ed4f2ba0265705b8793d05] this seems to be a bug. I attached a video showing the behaviour.

[View:/cfs-file/__key/communityserver-discussions-components-files/13/Bildschirmaufnahme-2023_2D00_04_2D00_20-um-08.09.07.mp4:320:240]

harshitb6843
April 20, 2023

[mention:126a676c85024855948336691b0a7b92:e9ed411860ed4f2ba0265705b8793d05] Not sure if it is only for me - 

stefanhelzle0001
Brainy
April 20, 2023

I changed the format to mp4. Does that work for you?

April 20, 2023

What I understood is that the choice values are the Ids that are not null but the choice labels are non id fields that are nullable, here you need to put a filter on the query to return only that data which will not have nulls in the field used in the choice labels. 

stevene0005
April 20, 2023

This was just a test interface to show/explain a bug. The actual interface had ID fields from a database as the Value & Description fields from a database as the Choices. A description had not been added to 3 of the 100+ rows. Having a dropdown with 100+ choices but 1 or more of them being blank causes this issue (Stefan replicated it & added a video).

I had forgotten to mention in the post originally, but for the users, this issue was causing the entire page to turn into a gray screen (needing to manually refresh the web-page to fix). But for me it was looking like a page refresh, although selected values on the page were being retained for me.

jayaprakashr0001
Participating Frequently
April 20, 2023

Hi,

Slight correction in your code hope it will help you for the null values

a!localVariables(
  local!choices: reject(fn!isnull,touniformstring({enumerate(15), "", enumerate(89)})),
  local!values: enumerate(count(local!choices)),
  local!selection: null,
  a!sectionLayout(
    contents: a!dropdownField(
      label: "Dropdown",
      placeholder: "-- Select a Value --",
      choiceLabels: local!choices,
      choiceValues: local!values,
      value: local!selection,
      saveInto: local!selection
    )
  )
)