Bixby Developer Center

Checks if the passed input follows the specified pattern. You should also add any server-side validation that you might need.

Examples

text-input {
  id (zipCode)
  type (ZipCode)
  pattern {
    regex ("\\d{5}") {
      on-error ("Zip Code Not Valid") // Optional
    }
  }
  value ("#{raw(this.zip)}")
}

text-input{
  id (pNumber)
  type (PhoneNumber)
  pattern {
    mask ("(###)###-####") {
      placeholder-char (_) // optional
      guide (true) // optional
    }
  }
  value ("#{raw(this.phoneNumber)}")
}

text-input {
  id (email)
  type (EmailAddress)
  pattern {
    email {
      on-error ("We can't read this email address") // Optional
    }
  }
  value("#{raw(this.emailAddress)")
}

Here is a full example of using a pattern in an input-view:

input-view {
  match {
    IsSigningUp (isSigningUp) {
      to-input: SubmitSurvey
    }
  }

  message {
    template ("Sign up for the mailing list?")
  }

  render {
    form {
      elements {
        checkbox {
          id (isSigningUp)
          type (IsSigningUp)
          primary-text("Mailing List")
          secondary-text("Receive monthly updates from our company")
          value("{raw(survey.isSigningUp)}")
        }
      }
      on-submit {
        goal: IsSigningUp
        value: viv.core.FormElement(isSigningUp)
      }
    }
  }
}

You can run the sample capsule in the Simulator to see how this component displays on different devices, if supported.