Jquery: val() возвращает значение параметра value поля input, а не введенное значение

опишу вкратце алгоритм работы. По клику на любое поле таблицы появляется поповер, содержимое которого подтягивается из соответствующего ему <div> элемента. В поповере содержится форма для изменения значения таблицы. По клику на сабмит кнопку делается ajax колл. Проблема в том, что вместо возвращения значения, введенного в input поле, возвращается значение, которое является пре-филлером для поля. Я сто раз проверил, все id - уникальные. Input поле трекается правильно, я могу вернуть значения его параметров без каких-либо проблем и после 2 дней я уже не понимаю что может быть не так.

Вот HTML:

{% for cleaning in cleaning_list %}
  <tr>
    <td class="text-md-center with-popover" name="name" value="{{cleaning.id}}"> 
      {{ cleaning.name }} 
      <div id="name{{cleaning.id}}" style="display: none">
        <form method="POST" id="form_frequency{{cleaning.name}}">
          {% csrf_token %}
        <label for="cleaning_name">Название: </label>
        <input id="cleaning_name{{cleaning.id}}" type="text" name="cleaning{{cleaning.name}}" value="{{ cleaning.name }}"> 
        <button type="submit" class="btn btn-success btn-sm update-cleaning" name="cleaning_name" data-model="Cleaning" data-field="name" value="{{cleaning.id}}"> Обновить </button>
        </form>
      </div>
    </td>
    <td class="text-md-center with-popover" name="difficulty" value="{{cleaning.id}}">
      {{ cleaning.difficulty }}
      <div id="difficulty{{cleaning.id}}" style="display: none">
        <form method="POST" id="form_frequency{{cleaning.difficulty}}">
        {% csrf_token %}
        <label for="cleaning_difficulty">Сложность: </label>
        <input id="cleaning_difficulty{{cleaning.id}}" type="text" name="difficulty{{cleaning.difficulty}}" value="{{ cleaning.difficulty }}"> 
        <button type="submit" class="btn btn-success btn-sm update-cleaning" name="cleaning_difficulty" data-model="Cleaning" data-field="difficulty" value="{{cleaning.id}}"> Обновить </button>
        </form>
      </div>
    </td>
    <td class="text-md-center with-popover" name="frequency" value="{{cleaning.id}}" >
      {{ cleaning.frequency }}
      <div id="frequency{{cleaning.id}}" style="display: none">
        <form method="POST" id="form_frequency{{cleaning.id}}">
        {% csrf_token %}
        <label for="cleaning_frequency">Частота: </label>
        <input name="cleaning_frequency" type="text" id="cleaning_frequency{{cleaning.id}}" value="{{cleaning.frequency}}"> 
        <button type="submit" class="btn btn-success btn-sm update-cleaning" name="cleaning_frequency" data-model="Cleaning" data-field="frequency" value="{{cleaning.id}}"> Обновить </button>
        </form>
      </div>
    </td>
  </tr>
{% empty %}
  <tr>
    <td colspan="7" class="text-center bg-warning">Видов уборок пока-что нет :( Скорее добавь какую-нибудь</td>
  </tr>
{% endfor %}

Вот скрипт который отвечает за сбор данных из формы и отправку их на сервер:

$(document).on("click", ".update-cleaning", function(event){
  event.preventDefault();
  var obj_id = $(this).attr('value');
  var input_field_name = $(this).attr('name');
  var model_name = $(this).attr('data-model');
  var field_name = $(this).attr('data-field');
  var input = $("#" + input_field_name + obj_id).val();
  if (!input) {
      alert('Заполните поле!')
    }
  else {
  $.ajax({
            url: "{% url 'ajax_update_cleaning' %}",
            type: "POST",
            data: {'object_id': obj_id, 'model_name': model_name, 'field_name': field_name, 'value': input, 'csrfmiddlewaretoken': '{{ csrf_token }}'},
            dataType: 'json',
        })
        .done(function(response){
                    console.log(response);
                })
        }
});

Ответы (0 шт):