Skip to main content Skip to docs navigation

Save on enter/on change Form Example

On this page
Stats
#callbacks:
import BSFormRenderer.*
import com.fastscala.components.bootstrap5.helpers.BSHelpers.*
val BSFormRenderer: BSForm7Renderers = new BSForm7Renderers {
  override def defaultRequiredFieldLabel: String = "Required Field"
}
val editing = new User1(
  firstName = "John",
  lastName = "Doe",
  email = "john.doe@email.com",
  phoneNumber = "+1 123456789",
  securityLevel = 3,
  countryOfResidence = CountriesData.data.find(_.name.common == "United States").get,
  birthday = None,
  province = Province(1, "P1"),
  city = City(1, "C1"),
  enableLogin = false
)
class ExampleForm extends Form7 {
  override def onSubmitIgnoredFormAlreadySaved()(implicit fsc: FSContext): Js =
    BSToast2.Simple(<span>Form already saved!</span>)(<p>
      Form is already saved, submit was ignored.
    </p>).positionTopRight.installAndShow()

  override def postSubmitForm()(implicit fsc: FSContext): Js = {
    BSToast2.Simple(<span>Submitted!</span>)(<div>
      <p>{editing.firstName}{editing.lastName}, with email {editing.email}, and birthday on {editing.birthday.map(_.toString).getOrElse("--")}.</p>
      <p>User from country {editing.countryOfResidence.name.common}.</p>
      <p>Login for user is: {editing.enableLogin}.</p>
    </div>).positionTopRight.installAndShow()
  }

  override lazy val rootField: F7Field = F7VerticalField()(
    F7ContainerField("row")("col" -> new F7StringField().label("First Name").rw(editing.firstName, editing.firstName = _), "col" -> new F7StringField().label("Last Name").rw(editing.lastName, editing.lastName = _)),
    new F7StringField().label("Email").rw(editing.email, editing.email = _).inputType("email"),
    new F7SelectField[Country](CountriesData.data.toList).label("Country of Residence").rw(editing.countryOfResidence, editing.countryOfResidence = _).option2String(_.name.common),
    new F7LocalDateOptField().rw(editing.birthday, editing.birthday = _).label("BirthDay"),
    new F7CheckboxField().label("Login enabled").rw(editing.enableLogin, editing.enableLogin = _),
    new F7SubmitButtonField[BSBtn](implicit fsc => BSBtn().sm.addClass(w_100.d_block.getClassAttr), _.lbl("Saved").BtnOutlineSecondary, _.lbl("Save").BtnSuccess, _.lbl("Error").BtnDanger)
  )

  override def formRenderer: F7FormRenderer = BSFormRenderer.formRenderer
}

Form submitting on enter

scala
div.border.p_2.rounded.apply {
  new ExampleForm() {
    override def submitOnSuggestion: Boolean = true
  }.render()
}

Form submitting on change

scala
div.border.p_2.rounded.apply {
  new ExampleForm() {
    override def submitOnChangedField: Boolean = true
  }.render()
}