Name field: One field or multiple text fields

  • Resolved Brian

    (@bwold)


    5 years, 1 month ago

    I like the idea that Forminator has a name field that can split into First, Middle and Last… but the display of that field is pretty funky. As near as I can tell, someone (arbitrarily) decided that Prefix and First name would go on one row, and Middle and Last on another row.

    But we’re asking for Middle Initial. Ideally, we’d have one row with First – MI – Last, and the MI field would be roughly one character wide. Unless I’m missing it, that just doesn’t work. Since I’ve hidden the prefix field, I get First across an entire row (no one’s name is that long!), then MI and Last in a row below it. Ugly.

    Forminator Name Options

    Alternatively, I can set up separate text fields for First, MI and Last — and drag them into place so I have three equal-width fields in a row. Good enough, although the MI field is bigger than needed.

    But: we’re using Stripe Payments. I can pass a field to Stripe for Name, but I can’t pass three fields together, and not text input fields. Right now, all I am able to do is pass Last Name, which is better than nothing. (I know, I can pass First and Middle as metadata, but that’s not ideal.)

    So: a) if there’s a way to load the multiple Name field all on one row, and with decent sizing, cool. OR, b) if there’s a way to concatenate the separate First, MI and Last fields into one (hidden?) field that I can pass to Stripe, cool.

    Thanks in advance for the help/suggestions.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Dmytro – WPMU DEV Support

    (@wpmudevsupport16)

    5 years, 1 month ago

    Hi there @bwold

    Indeed, the styling of the Multiple Name field could use some extra lovin’ 🙂

    I believe the developers/designers are working on improving that aspect. In the meantime though, you could ad a custom class to the name field under its Styling tab when editing the field.

    Then use some custom CSS like this example so to at least get the parts on a single line (custom class added to the Styling tab for this example = my-custom-name-field):

    .my-custom-name-field .forminator-row {
    float: left;
    max-width: 41%;
    display: inline !important;
}
.my-custom-name-field .forminator-row .forminator-col-6 {
    width: 50%;
    display: inline;
    float: left;
}

    Then a bit of fiddling with widths, margin & padding to get ’em all to fit to your liking in your form.

    And indeed, you can’t pass other fields to Stripe unless they’re added as custom metadata, so not ideal.

    I’d think some custom styling would probably be the simplest solution for this.

    Cheers!
    Patrick

    Thread Starter Brian

    (@bwold)

    5 years, 1 month ago

    Thanks for the reply, and the excellent use of apostrophes.

    I had been experimentin’ with something similar, but using CSS Flex:

    .my-custom-name-field {
    display: flex;
}
.my-custom-name-field .forminator-row {
    flex-grow: 1;
}
.forminator-row:nth-child(1) {
	padding-right: 2em;
}

    Still not there, but closer… and it’ll still need responsive overrides for mobile display. Still, glad to hear the devs are working on something. Fingers crossed.

    Thanks again,

    -B

    Thread Starter Brian

    (@bwold)

    5 years, 1 month ago

    Closing.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Name field: One field or multiple text fields’ is closed to new replies.

Tags