Update Form: Limit User's Number of Selections in a Field with List - String Datatype

[wimtracking2]

I have an update form with one field that is a List-String. It includes 50 options. I want this to be a multi-select field but want to limit the user to only be able to select up to 8 options. Is this possible?

[CoopperBackpack]

Hello @wimtracking2,

The easiest way is to restrict submitting the form when more than 8 values in the List-String field were selected.

As far as I understand, you are referring to the Single Record Update form.

I tested this code and it works for me:

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script>
document.addEventListener("BeforeFormSubmit", function (event) {
  const listOfvalues = document.querySelector('input[name="EditRecordlist"]').value;  // replace the 'list' part with your field name
  const numberOfValues = listOfvalues.split(",").length;

  if (numberOfValues > 8) {
    event.preventDefault();

    Swal.fire({
      icon: "warning",
      title: "Select less than 8 values",
    });
  }
});
</script>

You may paste the code to the Footer section and disable the HTML editor before pasting.

I am using so-called SweetAlert (https://sweetalert2.github.io/) to display a warning and the first line of code and Swal.fire() refers to it.

Edited December 16, 2021 by CoopperBackpack
Changed the selector for the listOfvalues variable, so it works for Multiselect Dropdown and Multiselect Listbox

[Kurumi]

You may also check this post:

 

[wimtracking2]

On 12/8/2021 at 9:42 AM, CoopperBackpack said:

Hello @wimtracking2,

The easiest way is to restrict submitting the form when more than 8 values in the List-String field were selected.

As far as I understand, you are referring to the Single Record Update form.

I tested this code and it works for me:

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script>
document.addEventListener("BeforeFormSubmit", function (event) {
  const listOfvalues = document.querySelector('input[id^="EditRecordlist"]').value; // replace the 'list' part with your field name
  const numberOfValues = listOfvalues.split(",").length;

  if (numberOfValues > 8) {
    event.preventDefault();

    Swal.fire({
      icon: "warning",
      title: "Select less than 8 values",
    });
  }
});
</script>

You may paste the code to the Footer section and disable the HTML editor before pasting.

I am using so-called SweetAlert (https://sweetalert2.github.io/) to display a warning and the first line of code and Swal.fire() refers to it.

This is exactly what I needed and it worked perfectly, thank you.

[Kurumi]

Hi - For the List data type, the limit is 1000: https://howto.caspio.com/troubleshooting/system-limitations/#:~:text=List data type – lookup items. Take note that the limit includes the visible and deleted options (when used in the data records).

[Queso]

Hi @wimtracking2!

You can also look into this Caspio HowTo article that I've found. When a user reaches the indicated limit, the remaining checkboxes are disabled:

https://howto.caspio.com/tech-tips-and-articles/setting-the-maximum-number-of-listbox-selections-in-forms/