Изменение порядка списка в FormidablePro с помощью jQuery UI

Question

Я сталкивался с этим методом использования jQuery в FormidablePro для реорганизации списка в представлении.

Представление основывается на форме с 2 полями: Число (тип числа) и Имя (тип текста), уже с введенными данными.

Во-первых, в разделе ПЕРЕД КОНТЕНТОМ идут вызовы скрипта и открытие списка div и неупорядоченного списка:

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="/wp-includes/js/jquery/jquery.ui.touch-punch.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
    jQuery( '#sortable' ).sortable({
        stop: function () {
            var inputs = $('input.form-control');
            var nbElems = inputs.length;
            $('input.form-control').each(function(idx) {
                $(this).val(nbElems - idx);
            });
        }
    });
});
</script>
<div class="ListContainer">
<ul id="sortable">

Затем в разделе СОДЕРЖАНИЕ идут поля для отображения внутри тегов списка:

<li class="ui-state-default" id="listItem">
    <i class="fa fa-arrows" aria-hidden="true"></i>
    <div class="listLine"> [68] - [69]</div>
</li>

(где 68 - это число, а 69 - это имя)

И, наконец, в разделе AFTER CONTENT (закрывается неупорядоченный список и div):

</ul>
</div>

Единственный CSS на данный момент (я вставил его в дополнительный раздел CSS для Wordpress на странице "Настройка") - это стилизация строки списка и значка обработчика:

/* List line (repeatable) */
div.listLine {
    display:block;
    width:100%;
    height:30px;
    margin-bottom:20px;
    background:green;
    color:white;
    text-align:left;
    padding:5px;
    font-size:14px;
}

/* Field Drag and Drop Icon CSS */
i.fa.fa-arrows {
    float: right;margin-top: 6px;color:white;
}

Сработало как положено. Я могу перетаскивать и сортировать элементы списка, и, очевидно, список возвращается в исходное состояние порядка, если страница обновляется.

Но теперь мне нужно, чтобы каждый раз, когда я перетаскивал элементы списка, поле Number тоже внутренне изменялось, то есть переназначался новый порядок для всех записей в поле Number (68) в форме, чтобы список оставался упорядоченным таким образом.

Я знаю, что должен быть быстрый и простой способ, но я не могу понять из-за моих коротких навыков программирования. Я думаю, что добавление строки в функцию в стиле "this.Field(68)=idx" поможет. Пожалуйста, просветите меня.