Неизвестное количество входных данных, необходимых в форме, альтернатива без Ajax?

Question

Я пишу небольшое веб-приложение для мобильных устройств.

Существует форма, запрашивающая конкретный элемент и его детали, пользователи должны иметь возможность вставить один или несколько элементов с их деталями.

Если бы это было обычное веб-приложение, я бы использовал ajax со ссылкой «добавить один», как это делает gmail для вложений. Я думаю, что для мобильных устройств использование AJAX не очень хорошая идея, поэтому я использовал кнопку «все готово» и «добавить еще», которые загружают новую страницу, а остальная часть списка сохраняется на стороне сервера. Это означает, что для каждого нового элемента пользователю необходимо перезагрузить страницу, это происходит медленно и может стоить моим пользователям больше. Есть ли лучший способ сделать это?

Answer 1

Извините, я неверно истолковал вопрос. Я не понимаю, почему использование AJAX было бы плохой идеей - если это был ненавязчивый AJAX , использующий принципы прогрессивного улучшения . Вся идея PE в том, что он будет работать на всех устройствах.

1. Кодируйте ваше решение не AJAX, используя метод обратной передачи, как у вас.
2. Добавьте ненавязчивый AJAX, который предотвращает возникновение обратной передачи и выполняет все асинхронно.

Для пользователей, у которых включен JS, это будет хорошо работать. Для тех, кто этого не делает, он все равно будет хорошо работать, только с обратной передачей.

Answer 2

Вам не нужно сохранять его на стороне сервера; просто делайте обычную обратную передачу и добавляйте новый HTML на сервер - но сохраняйте пока список в возвращенном HTML.

Так, например, упрощенный HTML изначально будет:

<form>
  <input name="info0" type="text" value="" />
  <input name="done" type="submit" value="I'm done" />
  <input name="more" type="submit" value="Add another" />
</form>

Если пользователь наберет «foo» для «info0» и выберет «Добавить еще», возвращенный HTML из обратной передачи теперь будет выглядеть так:

<form>
  <input name="info0" type="text" value="foo" />
  <input name="info1" type="text" value="" />
  <input name="done" type="submit" value="I'm done" />
  <input name="more" type="submit" value="Add another" />
</form>

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