If there is a need to have fields display in a different order on the front end vs. the back end/PDF, this is one solution.
Create duplicate fields. and show/hide using Custom CSS Classes on the front end and reverse show/hide for the PDF/back end.
This example code can be used in HTML field anywhere on the form to duplicate the field data: (37-form ID, 332 and 333 field IDs)
<script>jQuery('#input_37_332').on('keyup', function() {
jQuery('#input_37_333').val(jQuery(this).val());
})</script>
jQuery('#input_37_333').val(jQuery(this).val());
})</script>