I have created two functions for a multi-step configuration on a webpage.
protected clickNext(event:any, config:any) : any{
this.activeIndex++;
}
protected clickPrev(event:any, config:any) : any{
this.activeIndex--;
}
Here are the buttons:
<div class="form-group text-center">
<button type="submit" class="btn" style="color: white" [disabled]="prevBtn_disabled" (click)="clickPrev($event, _finalConfig)">Prev</button>
<button type="submit" class="btn" style="color: white" [disabled]="nextBtn_disabled" (click)="clickNext($event, _finalConfig)">Next</button>
</div>
Clicking the next button triggers the clickNext function, and clicking the previous button triggers the clickPrev function. The activeIndex variable determines which step to activate in the HTML. My goal is to prevent incrementing the index past the last step or decrementing it before the first step. I am new to JavaScript, so I am seeking guidance on how to achieve this. Thank you in advance!