I am stuck at a point where I need to fill out an input form. However the full xpath is dynamic, and the static parts of the element is the exact same as the static parts of another element. So I can't use xpath functions like select by id, select by classname and so forth.
The only way to differentiate between the field I am supposed to fill out and the field I need to ignore is that the actual id number is one less than the other id number. For example
effective-date-field-id = dp98
expiration-date-id = dp99
Bellow is the html. What can I do? I guess I can just select both elements and just get the integer value of the ID part, and select the one that has a smaller integer value? Or is there a easier way to do this? Thanks.
Effective date (I am supposed to fill out)
<div class="form-group">
<label class="required" data-bind="text: Labels.EffectiveDate">Effective Date</label>
<div data-bind="control: EffectiveDate"><!-- ko if: !HideDate -->
<input type="text" class="datetime-picker-date hasDatepicker input-sm" data-bind="value: Date, valueUpdate: 'keyup', jqWidget: { datepicker: DatePickerArgs }, assignTo: DateField, attr: { 'readonly': IsReadOnly() }, enable: IsEnabled, css: { 'input-sm': SmallSize, 'halfFullWidth': !SmallSize && !HideTime }" id="dp1584836974247">
<!-- /ko -->
<!-- ko if: !HideTime --><!-- /ko --></div>
</div>
Expiration Date (not supposed to fill out)
<div class="form-group">
<label data-bind="text: Labels.ExpirationDate">Expiration Date</label>
<div data-bind="control: ExpirationDate"><!-- ko if: !HideDate -->
<input type="text" class="datetime-picker-date hasDatepicker input-sm" data-bind="value: Date, valueUpdate: 'keyup', jqWidget: { datepicker: DatePickerArgs }, assignTo: DateField, attr: { 'readonly': IsReadOnly() }, enable: IsEnabled, css: { 'input-sm': SmallSize, 'halfFullWidth': !SmallSize && !HideTime }" id="dp1584836974248">
<!-- /ko -->
<!-- ko if: !HideTime --><!-- /ko --></div>
</div>