Next Label using tab on keyboard (Bootstrap) - php

Question

I'm a beginner at Bootstrap. When I press Tab, I want to select the next tab.
Click loan_form.php and then the cursor is automatically in Loan Name. After you complete it and press tab on the keyboard, the cursor will move to the Department label instead of the Device code label:
<div class="row">
<div class="col-md-6 mb-3">
<label>* Loan Name</label>
<input type="text" class="form-control" name="loan_name" id="loan_name" placeholder="Full Name" required>
</div>
<div class="col-md-6 mb-3">
<label>Device Code</label>
<select name="device_code" class="form-control" id="device_code" data-validetta="required" ></select>
</div>
</div>
<br />
<div class="row">
<div class="col-md-6 mb-3">
<label>* Department</label>
<input type="text" class="form-control" name="dept" id="dept" placeholder="Department" required></div>
<div class="col-md-6 mb-3">
<label>Brand</label>
<input type="text" class="form-control" name="device_brand" id="device_brand" placeholder="Brand" disabled required>
</div>

Answer 1

Use tabindex html tag in all the input fields. See reformatted code here:
<div class="row">
<div class="col-md-6 mb-3">
<label>* Loan Name</label>
<input type="text" class="form-control" name="loan_name" id="loan_name" placeholder="Full Name" required tabindex="1">
</div>
<div class="col-md-6 mb-3">
<label>Device Code</label>
<select name="device_code" class="form-control" id="device_code" data-validetta="required" tabindex="2"></select>
</div>
</div>
<br />
<div class="row">
<div class="col-md-6 mb-3">
<label>* Department</label>
<input type="text" class="form-control" name="dept" id="dept" placeholder="Department" required tabindex="3"></div>
<div class="col-md-6 mb-3">
<label>Brand</label>
<input type="text" class="form-control" name="device_brand" id="device_brand" placeholder="Brand" disabled required tabindex="4">
</div>