Bind multiple inputs to one element

Describe the new feature you’d like

I’m trying to create a component that is comprised of:

• an input text field
• a select element

I was thinking of a few ways to achieve it.

Method 1: Custom input I would build a component similar to FormulateInputText but I’m not exactly sure how I would use v-model since now I would have an object {inputName: value, selectName, selectValue}

Method 2: wrapper with 2 FormulateInput I could wrap a custom element with:

• my own label
• 2 FormulateInput with no label and no classes (expect for the outer)

<template>
  <div>
    <mylabel />
    <div class="my_wrapper">
      <FormulateInput type="text" />
      <FormulateInput type="select" />
    </div>
  </div>
</template>

With the correct classes I could probably achieve the expected outcome this way as well.

Any suggestions?

[justin-schroeder]

@handplant validation rules are passed a value property in their context object. That value property would have both values so you could write a validation rule to check both items. Rules are intentionally easy to write:

https://vueformulate.com/guide/validation/#custom-validation-rules

[borisdayma]

Thanks a lot for the feedback. As I played with it over the past few days I realize how Vue-Formulate is powerful! I think as it gets more examples it will be easier for users. Right now I get inspiration from the source files. Great project!