How do you create a single use drop down selection in Lists?

Question

I am creating a schedule sign-up in Lists. I am feeding the drop-down date/time options from another list. I have enforced unique values in the column, but the "used" options are still listed in the drop-down. How do I get only the available options to show?

Or is there another way to do this?

Thanks,

Courtney

Answer 1

Hi @Courtney,

Since modern page doesn't support script editor web part any more. If we want to custom our page with js or css, we will need to use spfx web part. We can create a spfx web part which allows us to insert js. Please refer to the following solution

https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-script-editor

After add the web part in your page. You could insert the following js code to create a single use drop down selection

var categoryField = cldList.get_fields().getByInternalNameOrTitle("Category");
var categoryChoiceField = context.castTo(categoryField, SP.FieldChoice);
context.load(categoryChoiceField);

context.executeQueryAsync(function () {
        var categoryChoices = categoryChoiceField.get_choices();

          //now your logic
          //var i=categoryChoices.indexOf(SelectedValue);
          //categoryChoices.splice(i, 1);
            categoryChoiceField.set_choices(categoryChoices);
            categoryChoiceField.updateAndPushChanges();
            context.executeQueryAsync(function () { }, function () { });

    }, function () { }); 

---

If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.