Первый шаг: закодируйте цикл, чтобы заполнить первое поле значениями в БД.
Далее: Drag & Drop станет более сложным, чем вы хотите, если вы только начинаете. В зависимости от настроек, вы можете сделать довольно простое событие onclick (), чтобы обновить второе окно и не требовать кнопку, но, чтобы соответствовать сказанному вами поведению, наведите кнопку на функцию javascript, которая просматривает набор значений для первого окна, а затем добавляет их во второй ящик. Вероятно, есть более элегантные способы сделать это, но только использование .innerhtml должно работать.
Наконец: закодируйте страницу обработки, чтобы использовать обновление базы данных на основе значений второго поля.
Я не понимаю, что делает вторая коробка в этом. Это что-то вроде предварительного просмотра (вот что я добавлю в БД, если вы нажмете «Отправить»)?