Vue-form-generator: Select option another properties

[icetee]

Hi, I would like to set default value, but I can't change Nothing selected value. And if id equal to 0 then the result is [object Object].

{
  type: "select",
  label: "Salutation",
  model: "salutation",
  featured: false,
  required: true,
  values: function() {
    return [
      { id: 0, name: "Please select", disabled: true },
      { id: 1, name: "Mr." },
      { id: 2, name: "Lady" },
      { id: 3, name: "Waitress" },
      { id: 4, name: "Disable test" }
    ]
  }
}

<select class="form-control">
    <option disabled="disabled" value="">&lt;Nothing selected&gt;</option>
    <option value="[object Object]">Please select</option>
    <option value="1">Mr.</option>
    <option value="2">Lady</option>
    <option value="3">Waitress</option>
    <option value="4">Disable test</option>
</select>

[lionel-bijaoui]

It seem to be undocumented (sorry about that), bur you can add and option under selectOptions called noneSelectedText. So from your example, it would look like that:

{
  type: "select",
  label: "Salutation",
  model: "salutation",
  featured: false,
  required: true,
  values: function() {
    return [
      { id: 1, name: "Mr." },
      { id: 2, name: "Lady" },
      { id: 3, name: "Waitress" },
      { id: 4, name: "Disable test" }
    ]
  },
  selectOptions: {
    noneSelectedText: 'Please select'
  }
}

[cristijora]

Damn this is useful.. Sad I didn't know about it

[lionel-bijaoui]

I didn't knew about it either, I just checked the sources. I did a pull on the documentation, just waiting for @icebob to merge the changes

[icebob]

I merged. Thanks @lionel-bijaoui !