Clear the select menu options.

I want to clear the select menu options when the bot logs the role to the DB.

62 Replies

- What's your exact discord.js npm list discord.js and node node -v version? - Not a discord.js issue? Check out #other-js-ts. - Consider reading #how-to-get-help to improve your question! - Explain what exactly your issue is. - Post the full error stack trace, not just the top part! - Show your code! - Issue solved? Press the button! - ✅ Marked as resolved by OP

treble/luna•2mo ago

update the message with the same components

tateOP•2mo ago

currently i thought to just update the components so I did so below:

const { EmbedBuilder, StringSelectMenuBuilder, RoleSelectMenuBuilder, ActionRowBuilder, MessageFlags } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_perms-aa',
  execute: async (interaction) => {
    const selectedRole = interaction.values[0]
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { perms_AllAccessRole: selectedRole } },
      { upsert: true, new: true }
    )

    const staffMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-staff')
    .setPlaceholder('Select the Department Personnel role');
    const hicommMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-hicomm')
    .setMaxValues(1)
    .setPlaceholder('Select the High Commander role');
    const allAccessMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-aa')
    .setPlaceholder('Select the All Access role')
    .setMaxValues(1);

    const staffRow = new ActionRowBuilder().addComponents(staffMenu)
    const hicommRow = new ActionRowBuilder().addComponents(hicommMenu)
    const aaRow = new ActionRowBuilder().addComponents(allAccessMenu)

    interaction.update({ components: [staffRow, hicommRow, aaRow] })
  }
}

const { EmbedBuilder, StringSelectMenuBuilder, RoleSelectMenuBuilder, ActionRowBuilder, MessageFlags } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_perms-aa',
  execute: async (interaction) => {
    const selectedRole = interaction.values[0]
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { perms_AllAccessRole: selectedRole } },
      { upsert: true, new: true }
    )

    const staffMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-staff')
    .setPlaceholder('Select the Department Personnel role');
    const hicommMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-hicomm')
    .setMaxValues(1)
    .setPlaceholder('Select the High Commander role');
    const allAccessMenu = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_perms-aa')
    .setPlaceholder('Select the All Access role')
    .setMaxValues(1);

    const staffRow = new ActionRowBuilder().addComponents(staffMenu)
    const hicommRow = new ActionRowBuilder().addComponents(hicommMenu)
    const aaRow = new ActionRowBuilder().addComponents(allAccessMenu)

    interaction.update({ components: [staffRow, hicommRow, aaRow] })
  }
}

I did that and it still doesnt clear so not sure what to do here lol @treble/luna sorry for the ping but did I do this correctly?

treble/luna•2mo ago

does that code run? and what happens if you actually use the same components

tateOP•2mo ago

yes it runs, its a multi file handler. idk what you mean by same components?

treble/luna•2mo ago

the ones attached to the message

tateOP•2mo ago

oh like getting the embed but getting the components?

d.js docs•2mo ago

:property: Message#components [email protected] An array of action rows in the message. This property requires the GatewayIntentBits.MessageContent privileged intent in a guild for messages that do not mention the client.

tateOP•2mo ago

its a slash command so what would that doc be

treble/luna•2mo ago

.update doesnt exist on a slash command it only exists on component interactions so does the message

d.js docs•2mo ago

:property: RoleSelectMenuInteraction#message [email protected] The message to which the component was attached

tateOP•2mo ago

ok thx! i will look at this any other ideas i didnt see anything in those docs

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

just an answer to how to do this

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

right

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

I tried that Didn't work.

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

ok one se sec I had removed it

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    const ShiftLogChannelSelect = new ChannelSelectMenuBuilder()
    .setChannelTypes(ChannelType.GuildText)
    .setCustomId("crab-sm_shift-log")
    .setMaxValues(1)
    .setPlaceholder('Shift Logging')
    const ShiftODRoleSelect = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_on-duty-role')
    .setMaxValues(1)
    .setPlaceholder("On-Duty Role")
    const ShiftOBRoleSelect = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_on-break-role')
    .setMaxValues(1)
    .setPlaceholder("On-Break Role")

    const row1 = new ActionRowBuilder().addComponents(ShiftLogChannelSelect)
    const row2 = new ActionRowBuilder().addComponents(ShiftODRoleSelect)
    const row3 = new ActionRowBuilder().addComponents(ShiftOBRoleSelect)
    interaction.update({ 
components: [row1, row2, row3] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    const ShiftLogChannelSelect = new ChannelSelectMenuBuilder()
    .setChannelTypes(ChannelType.GuildText)
    .setCustomId("crab-sm_shift-log")
    .setMaxValues(1)
    .setPlaceholder('Shift Logging')
    const ShiftODRoleSelect = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_on-duty-role')
    .setMaxValues(1)
    .setPlaceholder("On-Duty Role")
    const ShiftOBRoleSelect = new RoleSelectMenuBuilder()
    .setCustomId('crab-sm_on-break-role')
    .setMaxValues(1)
    .setPlaceholder("On-Break Role")

    const row1 = new ActionRowBuilder().addComponents(ShiftLogChannelSelect)
    const row2 = new ActionRowBuilder().addComponents(ShiftODRoleSelect)
    const row3 = new ActionRowBuilder().addComponents(ShiftOBRoleSelect)
    interaction.update({ 
components: [row1, row2, row3] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

lemme get a recording of it

tateOP•2mo ago

ok so the code is above, the screen rec of the command being ran is below im very confused as to why it doesnt work for me

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

ActionRowBuilder.from()

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

yes i js found that todat and i js pass that into the components?

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    interaction.update({ components: [components] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    interaction.update({ components: [components] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

lemme test it

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    const row1 = ActionRowBuilder.from(components[0])
    const row2 = ActionRowBuilder.from(components[1])
    const row3 = ActionRowBuilder.from(components[2])
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: [row1, row2, row3] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    const row1 = ActionRowBuilder.from(components[0])
    const row2 = ActionRowBuilder.from(components[1])
    const row3 = ActionRowBuilder.from(components[2])
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: [row1, row2, row3] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

That code didn't work It still doesn't blank the menu

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

c\it didn't work it said a discord error: invalid form body cuz it has more then 1 row

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    // const row1 = ActionRowBuilder.from(components[0])
    // const row2 = ActionRowBuilder.from(components[1])
    // const row3 = ActionRowBuilder.from(components[2])
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: [components] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    // const row1 = ActionRowBuilder.from(components[0])
    // const row2 = ActionRowBuilder.from(components[1])
    // const row3 = ActionRowBuilder.from(components[2])
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: [components] })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

error:

/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:727
      throw new DiscordAPIError(data, "code" in data ? data.code : data.error, status, method, url, requestData);
            ^

DiscordAPIError[50035]: Invalid Form Body
data.components[0].components[BASE_TYPE_BAD_LENGTH]: Must be between 1 and 5 in length.
    at handleErrors (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:727:13)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async BurstHandler.runRequest (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:831:23)
    at async _REST.request (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:1272:22)
    at async ChannelSelectMenuInteraction.update (/Users/tatebasham/Documents/GitHub/crab/node_modules/discord.js/src/structures/interfaces/InteractionResponses.js:355:22)
    at async Object.execute (/Users/tatebasham/Documents/GitHub/crab/bot/Components/SelectMenus/03B - shift-log.js:17:5) {
  requestBody: {
    files: [],
    json: {
      type: 7,
      data: {
        content: undefined,
        tts: false,
        nonce: undefined,
        enforce_nonce: false,
        embeds: undefined,
        components: [
          {
            '0': [Object],
            '1': [Object],
            '2': [Object],
            type: 1,
            components: []
          }
        ],
        username: undefined,
        avatar_url: undefined,
        allowed_mentions: undefined,
        flags: undefined,
        message_reference: undefined,
        attachments: undefined,
        sticker_ids: undefined,
        thread_name: undefined,
        applied_tags: undefined,
        poll: undefined
      }
    }
  },
  rawError: {
    message: 'Invalid Form Body',
    code: 50035,
    errors: {
      data: { components: { '0': { components: [Object] } } }
    }
  },
  code: 50035,
  status: 400,
  method: 'POST',
  url: 'https://discord.com/api/v10/interactions/1350539541672366190/aW50ZXJhY3Rpb246MTM1MDUzOTU0MTY3MjM2NjE5MDpsZFdYUUJkQWd1cktqbHhUZWRRZXpQelBHZmlXODZmNFh6bFIyMkZSS3JETTdzaDVjNWlyRHNvSmlnRW9naFpMS0pDdEZOS2dxTGpVVTVBTEFWczVaN1ZJd2lrWXduQ1J4bVVSQno5SGpSbDVoQmNGRkwzWG9rU3ExQndDcVR1cg/callback?with_response=false'
}

Node.js v20.18.0

/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:727
      throw new DiscordAPIError(data, "code" in data ? data.code : data.error, status, method, url, requestData);
            ^

DiscordAPIError[50035]: Invalid Form Body
data.components[0].components[BASE_TYPE_BAD_LENGTH]: Must be between 1 and 5 in length.
    at handleErrors (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:727:13)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async BurstHandler.runRequest (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:831:23)
    at async _REST.request (/Users/tatebasham/Documents/GitHub/crab/node_modules/@discordjs/rest/dist/index.js:1272:22)
    at async ChannelSelectMenuInteraction.update (/Users/tatebasham/Documents/GitHub/crab/node_modules/discord.js/src/structures/interfaces/InteractionResponses.js:355:22)
    at async Object.execute (/Users/tatebasham/Documents/GitHub/crab/bot/Components/SelectMenus/03B - shift-log.js:17:5) {
  requestBody: {
    files: [],
    json: {
      type: 7,
      data: {
        content: undefined,
        tts: false,
        nonce: undefined,
        enforce_nonce: false,
        embeds: undefined,
        components: [
          {
            '0': [Object],
            '1': [Object],
            '2': [Object],
            type: 1,
            components: []
          }
        ],
        username: undefined,
        avatar_url: undefined,
        allowed_mentions: undefined,
        flags: undefined,
        message_reference: undefined,
        attachments: undefined,
        sticker_ids: undefined,
        thread_name: undefined,
        applied_tags: undefined,
        poll: undefined
      }
    }
  },
  rawError: {
    message: 'Invalid Form Body',
    code: 50035,
    errors: {
      data: { components: { '0': { components: [Object] } } }
    }
  },
  code: 50035,
  status: 400,
  method: 'POST',
  url: 'https://discord.com/api/v10/interactions/1350539541672366190/aW50ZXJhY3Rpb246MTM1MDUzOTU0MTY3MjM2NjE5MDpsZFdYUUJkQWd1cktqbHhUZWRRZXpQelBHZmlXODZmNFh6bFIyMkZSS3JETTdzaDVjNWlyRHNvSmlnRW9naFpMS0pDdEZOS2dxTGpVVTVBTEFWczVaN1ZJd2lrWXduQ1J4bVVSQno5SGpSbDVoQmNGRkwzWG9rU3ExQndDcVR1cg/callback?with_response=false'
}

Node.js v20.18.0

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

i did that in the one above the one that worked was me doing the ActionRowBuilder.from(components[0]) its fine i am being a bit difficult when it comes to this so i apologize its just annoying trying js about everything i can think of and nothing happening lol

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

ok thanks!! i promise i am a decent dev

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

no you mean this code?

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

no i did not

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

yes

🦀 Logged in as Crab!
🌺 Connected to DB.
[
  ActionRow {
    data: { type: 1, id: 1 },
    components: [ [ChannelSelectMenuComponent] ]
  },
  ActionRow {
    data: { type: 1, id: 3 },
    components: [ [RoleSelectMenuComponent] ]
  },
  ActionRow {
    data: { type: 1, id: 5 },
    components: [ [RoleSelectMenuComponent] ]
  }
]

🦀 Logged in as Crab!
🌺 Connected to DB.
[
  ActionRow {
    data: { type: 1, id: 1 },
    components: [ [ChannelSelectMenuComponent] ]
  },
  ActionRow {
    data: { type: 1, id: 3 },
    components: [ [RoleSelectMenuComponent] ]
  },
  ActionRow {
    data: { type: 1, id: 5 },
    components: [ [RoleSelectMenuComponent] ]
  }
]

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

ActionRowBuilder.from(components[0])?

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

same thing

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    const row1 = ActionRowBuilder.from(components[0])
    const row2 = ActionRowBuilder.from(components[1])
    const row3 = ActionRowBuilder.from(components[2])
    console.log(components)
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: interaction.message.components })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

const { EmbedBuilder, ChannelSelectMenuBuilder, RoleSelectMenuBuilder, ChannelType, MessageFlags, ActionRowBuilder, ActionRow } = require('discord.js')
const CrabConfig = require('../../schemas/CrabConfig')

module.exports = {
  customId: 'crab-sm_shift-log',
  execute: async (interaction) => {
    const selectedChannel = interaction.values[0]
    const components = interaction.message.components
    const row1 = ActionRowBuilder.from(components[0])
    const row2 = ActionRowBuilder.from(components[1])
    const row3 = ActionRowBuilder.from(components[2])
    console.log(components)
    await CrabConfig.findOneAndUpdate(
      { guildId: interaction.guild.id },
      { $set: { shift_Logs: selectedChannel } },
      { upsert: true, new: true }
    )
    await interaction.update({ components: interaction.message.components })
    await interaction.followUp({ content: `You have selected <#${selectedChannel}> as the shift log channel.`, flags: MessageFlags.Ephemeral })
  }
}

treble/luna•2mo ago

you dont have any default selected roles set eiter?

Unknown User•2mo ago

Message Not Public

tateOP•2mo ago

no all good mate

treble/luna•2mo ago

i vaguely remember this being an issue with role select menus

tateOP•2mo ago

i am doing a channel one for testing though

treble/luna•2mo ago

or well, channel select menus too

tateOP•2mo ago

treble/luna•2mo ago

all non string selects

tateOP•2mo ago

they just don't clear? is it a discord bug?

Unknown User•2mo ago

Message Not Public

treble/luna•2mo ago

dont think this behaviour is documented anywhere at all

tateOP•2mo ago

so like it just isn't supposed to clear lol thats odd.

treble/luna•2mo ago

refreshing your discord client should clear it though

tateOP•2mo ago

right, changing the channel does its just a quality of life thing for users ig but anyways, thanks! it is discord thought correct/ not like discord.js and such anyways thanks for trying!

Gaming

Programming

Clear the select menu options.

Did you find this page helpful?