How to simulate keyboard input of data in an input field?

Question

JavaScript

Good evening. I have a vue component in which a form for data entry. Below is part of the form.

<div class="form-group row">
          <label for="id-number" class="col-sm-3 col-form-label">{{voc.numberFss[lang]}}</label>
          <div class="col-sm-8">
            <input
              id="id-number"
              name="numberFss"
              type="text"
              class="form-control"
              :placeholder="placeHolderNumFss"
              @input.stop="inputHandler($event); $emit('search-fss')"
            >
          </div>
        </div>

To submit the form, all fields must have the isChecked=true status. As far as I understand, when the set is stopped on this field, the inputHandler method is called and the search-fss event fires.
The task arose to finalize this form by implementing the possibility of filling in the form fields from the xml file. I created a field for selecting a file and a button, on which I hung a method in which the fields are filled in by assigning value to the id of the fields. But the problem is that the status of the isChecked fields remains false.
So the question is, how do I programmatically simulate the end of printing in this form so that the events work?

Answer 1

Use .dispathEvent() to trigger the input event on the fields you need.

Answer 2

Add v-model to the input
and bind it to the value in data.
After loading the xml, substitute the received information into your value in data.
It will automatically be assigned to input.
And add watch to your value in data and as soon as it satisfies the conditions do true.
Or you can make isChecked a computed property and return true if the value in input matches the requirements.
All the same, this is vue and you need to use its functionality