How to populate character x and y of a memorable password

Hi there
Well as an example TSB bank login do it.

My guess is I need to store each character here in the appropriate labeled input box
1st box
<input label="charXPos" class="col-xs-12 form-control ng-pristine ng-invalid ng-invalid-required ng-valid-maxlength ng-touched" name="charXPos" id="charXPos" placeholder="2nd" maxlength="1" ng-change="checkValidation(memorableInformationForm, 'charXPos','X')" ng-keypress="blockSpecialChar($event)" ng-model="chars.testX" required="">

2nd box
<input label="charYPos" class="col-xs-12 form-control ng-pristine ng-invalid ng-invalid-required ng-valid-maxlength ng-touched" id="charYPos" name="charYPos" placeholder="5th" maxlength="1" ng-change="checkValidation(memorableInformationForm, 'charYPos','Y')" ng-keypress="blockSpecialChar($event)" ng-model="chars.testY" required="">

3rd box
<input label="charZPos" class="col-xs-12 form-control ng-pristine ng-untouched ng-invalid ng-invalid-required ng-valid-maxlength" id="charZPos" name="charZPos" placeholder="9th" maxlength="1" ng-change="checkValidation(memorableInformationForm, 'charZPos','Z')" ng-keypress="blockSpecialChar($event)" ng-model="chars.testZ" required="">

I have by using the save login and entering these characters first been able to store the individual chars, as separate fields in the 1password record. (not ideal as when or if i change that then I have to update all those fields also)

I was thinking in 1Password maybe a field that contains a password can be marked in such a way that user can pull out each character when prompted

In this case the password chars were just stored as
Character 2: etc.. in 1 password.

Once you have the naming convention I think having an option to split the memorable word into characters that can be accessed individually would work.

Its a tricky interaction