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提交表单。

接下来，我使用Contact Form 7的事件处理程序wpcf7invalid检查表单是否有错误。

如果有错误，我会检查文件输入是否存在或是否已删除。如果删除它，我会将其添加回表单，以便用户可以在下次连续尝试时上传文件。

XXXX代表表单ID。

我希望通过移动设备上的文件输入帮助其他任何有联系表格7问题的人。

联系表格7在移动时不提交

1 个答案: