Skip to content

Create your Form

What are FormBuilder?

The FormBuilder class is a lightweight, efficient, and flexible tool designed to enhance your application. It allows users to create multiple questions with different choices or free answers.

Key Features of FormBuilder

  • Flexible: Form is an extension of EmbedBuilder.
  • Langages Supports: Supports many langages (auto translation).

How to use it?

Start by instancied FormBuilder

js
import { FormBuilder } from 'umbrae';

const form = new FormBuilder();

Here's an example to create a form for your project.

js
import { FormBuilder } from 'umbrae';

const form = new FormBuilder()

.addQuestion((option) => option.setName('Name').setDescription('Please tell us you name.'))
.addQuestion((option) => option.setName('Like us ?').setDescription('Tell us if you like our project or not').addChoice('Yes').addChoice('No'))
.addQuestion(option => 
    option.setName('Favorite Event')
   .setDescription('Wich events do you prefer ?')
   .setChoices([
    'The fallen Angel',
    'Christmastermind',
    'The Mystery Event'
   ])
   .setMinChoices(2)
   .setMaxChoices(2)
)
.setColor('LightGrey')
.setTitle('Staff Form')

you can use the form with this method but we recommend you to use the FormManager to enhance your functionality :

js
import { FormBuilder, FormManager } from 'umbrae';

/*
 Existing code 
*/

const logs = message.guild.channels.cache.get('ID_HERE'); // your guilds logs.
const channel = message.channel; // the current channel.
const userId = message.author.id // the user who need this form.
new FormManager(channel, form, { userId, logChannel: logs }).send();

This code ensure you will receive the answers in yours logs after the user with the good id has answered.

All the FormBuilder methods and properties

addQuestion for more information about the options for this method see QuestionOption

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion((option) => option.setName('Name').setDescription('Please tell us you name.')) // add a question.

questions

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.questions // get a Map of all the questions.

setTitle

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.setTitle('Name') // set the title.

setColor

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.setColor('Blurple') // set the color of the form.

setReactions

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.setReaction('◀️', '▶️') // set the emoji reactions to change the current questions.

/* 
You can set 2 or 4 reactions.
Here is the second way.
*/
form.setReaction('⏪', '◀️', '▶️', '⏩')

Tips

The reaction to answer questions is added automatically.

All the QuestionOption methods

setId

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setId(0) // set the id to 0 (default value: random)
)
form.addQuestion(option =>
    option.setId(1) // set the id to 1 (default value: random)
)

// this method ensures that you can get your questions easily.

setName

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setName('An awesome name') // set a name to this question.
)

setDescription

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setDescription('An awesome description') // set a description to this question.
)

setType

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setType('Text') // set the type to 'Text'.
)
/*
    Type List 

    'Text': The answer must be a string.
    'Number': The answer must be a number.
    'Select': The answer is a selection of a choice.
    'Select Multiple': The answer is a group of selections.
*/

setMinChoices

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setMinChoices(2) // set the minimum choices to 2.
)

setMaxChoices

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setMaxChoices(2) // set the maximum choices to 2.
)

setChoices

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.setChoices(['Banana', 'Apple', 'Strawberry']) // define the available choices to 'Banana', 'Apple' or 'Strawberry'
)

addChoice

js
import { FormBuilder } from "umbrae";

const form = new FormBuilder();

form.addQuestion(option =>
    option.addChoice('Banana')
    .addChoice('Apple')
    .addChoice('Strawberry') 
    // define the available choices to 'Banana', 'Apple' or 'Strawberry'
)