What's invalid about the Regex `^[A-Za-z0-9]{3, 16}$`?

Hi I have a question about HTML input patter.

I tried to restrict any special character, but I got this error.

new:1 Pattern attribute value ^[A-Za-z0-9]{3, 16}$ is not a valid regular expression: Uncaught SyntaxError: Invalid regular expression: /^[A-Za-z0-9]{3, 16}$/: Incomplete quantifier

It is so weird why I got this error because the pattern is almost the same as patterns for other inputs. Only err msg for the question doesn't appear but others do.

Thanks for your valuable time in advance.

.quizForm {
  padding-top: 30px;
  .quizFormInputText, .quizFormInputSelect {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    label {
      font-size: $fzSmall;
      margin-bottom: 5px;
    }
    input {
      border: 1px solid rgb(200, 200, 200);
      font-size: $fzSSmall;
      padding: 10px;
      border-radius: 5px;
      &:invalid[focused="true"] ~ span {
        display: block;
      }
    }
    select {
      border: 1px solid rgb(200, 200, 200);
      font-size: $fzSSmall;
      padding: 10px;
      border-radius: 5px;
    }
    .errMsg {
      margin-top: 5px;
      color: red;
      font-size: $fzSSmall;
      padding: 5px 15px;
      background: rgb(255, 230, 230);
      display: none;
    }
  }
  button {
    padding: 10px 18px;
    border-radius: 5px;
    border: none;
    width: 100%;
    background: white;
    font-size: $fzSmall;
    cursor: pointer;
    transition: .3s;
    background: $colorGoNextQuizBtnHover;
    &.disableToClick {
      pointer-events: none;
      opacity: .5;
    }
  }
}

  const inputs = [
    {
      id: 1,
      name: 'question',
      type: 'text',
      placeholder: 'Is protein powder white happy magical snow??',
      err: 'this is a error message',
      pattern: '^[A-Za-z0-9]{3, 16}$',
      label: 'Question',
      required: true,
    },
    {
      id: 2,
      name: 'answer1',
      type: 'text',
      placeholder: 'No',
      err: 'this is a error message',
      label: 'Answer 1',
      required: true,
      pattern: '^[0-9]{1}$',
    },
    {
      id: 3,
      name: 'answer2',
      type: 'text',
      placeholder: 'Yes',
      err: 'this is a error message',
      label: 'Answer 2',
      required: true,
      pattern: '^[0-9]{1}$',
    },
    {
      id: 4,
      name: 'answer3',
      type: 'text',
      placeholder: 'Maybe',
      err: 'this is a error message',
      label: 'Answer 3',
      pattern: '^[0-9]{1}$',
    },
    {
      id: 5,
      name: 'answer4',
      type: 'text',
      placeholder: 'Tqm',
      err: 'this is a error message',
      label: 'Answer 4',
      pattern: '^[0-9]{1}$',
    },
    {
      id: 6,
      name: 'correctAnswer',
      type: 'number',
      placeholder: 1,
      err: 'this is a error message',
      label: 'Correct Answer',
      required: true,
    },
    {
      id: 7,
      name: 'category',
      // err: "this is a error message",
      label: 'Category',
    },
  ];

Via Active questions tagged javascript - Stack Overflow https://ift.tt/bmtlgf9