Передача данных формы для начальной загрузки - PullRequest
0 голосов
/ 08 июня 2018

Случай:

В моей базе данных есть таблица, в которой каждая строка содержит значение типа формы и кнопку сохранения в конце строки.

Теперь, что я хочу сделать, следующие вещи:

Когда я нажимаю кнопку сохранения, должно открываться модальное всплывающее окно, и оно должно отображать данные, которые присутствовали встрока, кнопка сохранения которой была нажата.

Также модал будет иметь две кнопки подтверждения и отмены.Если я нажимаю кнопку сохранения на модели, данные должны отправляться на сервер (я использую Django в качестве сервера).

Как я могу это сделать?

Любая помощь будет высоко оценена.

Код:

{% block content %}   

<table id ="devicetable" cellpadding="20%" style="width:100%">

    <thead>
        <tr>

            {% for column in columns %}

                <td>{{ column }}</td>

            {% endfor %}
          {% if type != "NReq" %}
            <td> Button </td>
          {% endif %}
        </tr>
    </thead>

{% for a in all %}

    <tr>
      <form action = {% url type %} method="POST">{% csrf_token %}

        {% for k in columns %}
              <td>{{ a|get_item:k }}<input type = "hidden" name = {{k}} value = "{{ a|get_item:k }}"></td>
        {% endfor %}
        {% if type != "NReq" %}
          <td> <button type="submit" class="btn btn-primary">{{type}}</button></td>
        {% endif %}

      </form>
      </tr>

{% endfor %}

</table>

{% endblock %}

1 Ответ

0 голосов
/ 08 июня 2018

Вы можете обработать событие отправки формы, нажав кнопку сохранения (см. Событие onsubmit ).Используйте это событие для вызова функции, в которой вы (a) :

  1. Откройте модальный
  2. Цикл через теги <input> внутри формы и отобразитесодержимое в модальном
  3. Возвращает false, чтобы эти данные не отправлялись на сервер

Теперь, когда модальное открыто, обрабатывать события ваших кнопок и вручную подниматьотправить событие вашей формы.Для jQuery это может выглядеть так: (b) - не проверено:

  • $("#submit").on("click", function() { $("#formId").submit(); });
  • $("#cancel").on("click", function() { $("#modalId").close(); });

Пожалуйстапримечание: когда вы отправляете форму из модального (b) , вы должны вставить глобальную переменную, чтобы не повторять шаги (a) .В противном случае форма никогда не будет отправлена.

...