Почему в FormData попадает не весь список form?

у меня есть блок с формой HTML:
<div class="cover mb-3 d-flex flex-wrap justify-content-center video__merge" id="video">
    <h3>Merge video from YouTube</h3>
    <p class="video_input">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quod amet fugit neque ullam, 
        id temporibus accusantium quaerat maxime aspernatur eum dolore repellat, 
        suscipit perferendis quae expedita. Aperiam ipsa eligendi illo?</p>
    <div class="container">
        <form method="POST" action="/" id="form__videos">
            {{ form.hidden_tag()}}
            {{form.name}}
            {{form.name}}
        </form>
    </div>
    <span>
        <button type="button" class="btn btn__main btn__add add_video">Add Video</button>
        <button type="submit" class="btn btn__main btn__send__video">Start Merge</button>
    </span>
</div>


На кнопку Add Video повешена функция добавления input:
const btnAddVideo = document.querySelector(".add_video")
const ContainerVideo = videos.querySelector(".container")
let videoForm = ContainerVideo.querySelector("#form__videos")

btnAddVideo.addEventListener('click', () =>{
    let input = document.createElement('input')
    input.classList.add('form-control')
    input.classList.add('video_input')
    input.placeholder = "Paste link from YouTube"
    input.id = "formGroupExampleInput"
    videoForm.appendChild(input)
})


После я навешиваю на кнопку btn__send__video вывод в консоль форму
const btnSendVideo = document.querySelector(".btn__send__video")
let videoForm = ContainerVideo.querySelector("#form__videos")

btnSendVideo.addEventListener('click',() =>{
    console.log(videoForm)
    let formData = new FormData(videoForm)
    for(let [name, value] of formData){
        console.log(`${name} == ${value}`)
    }
})


Получаю такой вывод:
<form method="POST" action="/" id="form__videos">
            <input id="csrf_token" name="csrf_token" type="hidden" value="ImE3MDM0ZWU2YmIzYTE1NWRhNzc3ZWFlNWQzODk2ZmYzODY4MTc4ZTMi.YvgPjQ.-pbbH2CG8zN5PBez16VLUAnG92E">
            <input class="form-control video_input" id="formGroupExampleInput" name="name" placeholder="Paste link from YouTube" type="text" value="">
            <input class="form-control video_input" id="formGroupExampleInput" name="name" placeholder="Paste link from YouTube" type="text" value="">
        <input class="form-control video_input" placeholder="Paste link from YouTube" id="formGroupExampleInput"></form>

csrf_token == ImE3MDM0ZWU2YmIzYTE1NWRhNzc3ZWFlNWQzODk2ZmYzODY4MTc4ZTMi.YvgPjQ.-pbbH2CG8zN5PBez16VLUAnG92E
name == test1
name == test2

Почему в переменной videoForm JavaScript видит, что полей 4, а в formData показывает только три поля?
  • Вопрос задан
  • 89 просмотров
Решения вопроса 1
Alexandroppolus
@Alexandroppolus
кодир
У четвертого поля формы нет аттрибута name, потому он не в игре.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы