Контактная форма 7 не отправляется на мобильный

Question

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

[text* full-name placeholder "Full Name"]
[email* your-email placeholder "Email"]
[tel* phone placeholder "Phone Number"]
<div class="input-wrapper">
[text* city class:input-city placeholder "City"]<span class="styled-select">[select* state class:input-state include_blank data:us_subdivisions.states]</span>
</div>
<div class="upload-wrapper">
[file applicants-resume id:fileuploadfield class:fileuploadfield filetypes:pdf|doc|docx id:applicants-resume][text uploadtextfield id:uploadtextfield class:uploadtextfield placeholder "Resume(PDF,Doc)"]<input type="button" id="uploadbrowsebutton" value="Browse">
</div>
[hidden position-id id:position-id "Position ID"]
[submit "Submit"]

Я искал в Интернете и нашел других людей с этой проблемой, но пока нет решения.Буду признателен за любую оказанную помощь.

ОБНОВЛЕНИЕ: Я обнаружил, что это будет работать, если есть прикрепленный файл, то есть поле имеет что-то в нем.Если поле пусто, оно не будет работать.

Answer 1

Хорошо, я смог собрать хак.Один человек предложил это.

$("input[type=file]").each(function() {
   if($(this).val() === "") {
     $(this).remove();
   }
  });

https://wordpress.org/support/topic/when-typefile-is-set-in-contact-form-7-it-does-not-work-with-safari-ver-11-1/

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

$('body').on('click', '.wpcf7-submit', function(e){

        $("input[type=file]").each(function() {
           if($(this).val() === "") {
             $(this).remove();
           }
        });

    });

document.addEventListener( 'wpcf7invalid', function( event ) {

        if ( 'XXXX' == event.detail.contactFormId ) {

            if( $(".fileuploadfield").parents(".applicants-resume").length == 1 ) {
                // we have a file
            } else {
                $('.applicants-resume').append('<input type="file" name="applicants-resume" size="40" class="wpcf7-form-control wpcf7-file wpcf7-validates-as-required fileuploadfield" id="fileuploadfield" accept=".pdf,.doc,.docx" aria-required="true" aria-invalid="false">');
            }

        }

    }, false );

Первая часть кода удаляет ввод файла, если он пуст.Это позволяет Safari IOS отправить форму.

Далее я проверяю, есть ли в форме ошибки, используя обработчик событий контактной формы 7 wpcf7invalid.

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

XXXX представляет идентификатор формы.

Надеюсь, это поможет кому-либо еще, имеющемупроблемы с контактной формой 7 при использовании файла ввода на мобильном телефоне.