Home
Support Forums

File attachment not included in Netlify Forms submission

Hello, Netlify community!

I am currently building a career site for K&N Rehab, Inc. – Physical Therapist. It is a branch deployment.

I was testing the form with the File upload feature in it. When I checked my submissions under the Forms tab, the Attachment is blank. I can’t see the PDF that I submitted.

Here’s the code of the form:

<form enctype="multipart/form-data" netlify method="POST"
									class="contact-form custom-form-style-1 appear-animation"
									data-appear-animation="fadeIn" data-appear-animation-delay="100"
									name="Physical Therapist Career Form">

									<div class="row">
										<div class="form-group col-md-12">
											<p class="text-3 mb-0">Attach your <strong>Resume</strong> here</p>
											<input class="d-block" type="file" accept=".pdf" name="attachment"
												id="attachment" required>
										</div>
									</div>
									<div class="row">
										<div class="form-group col-md-12">
											<input type="submit" value="Submit Application"
												class="btn btn-primary px-4 py-3 text-center text-uppercase font-weight-semibold"
												data-loading-text="Loading...">
										</div>
									</div>
									<div class="contact-form-success alert alert-success d-none mt-4">
										<strong>Success!</strong> Your message has been sent to us.
									</div>
								</form>

Here’s the JS code of the form:

// Ajax Submit
				$.ajax({
					type: 'POST',
					enctype: 'multipart/form-data',
					url: $form.attr('action'),
					data: data,
					processData: false,
                    contentType: false
				}).always(function(data, textStatus, jqXHR) {

					$errorMessage.empty().hide();

					if (data.response == 'success') {

						$messageSuccess.removeClass('d-none');
						$messageError.addClass('d-none');

						// Reset Form
						$form.find('.form-control')
							.val('')
							.blur()
							.parent()
							.removeClass('has-success')
							.removeClass('has-danger')
							.find('label.error')
							.remove();

						if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
							$('html, body').animate({
								scrollTop: $messageSuccess.offset().top - 80
							}, 300);
						}

						$form.find('.form-control').removeClass('error');

						$submitButton.val( submitButtonText ).attr('disabled', false);
						
						return;

					} else if (data.response == 'error' && typeof data.errorMessage !== 'undefined') {
						$errorMessage.html(data.errorMessage).show();

					} else {
						$errorMessage.html(data.responseText).show();
					}

					$messageError.removeClass('d-none');
					$messageSuccess.addClass('d-none');

					if (($messageError.offset().top - 80) < $(window).scrollTop()) {
						$('html, body').animate({
							scrollTop: $messageError.offset().top - 80
						}, 300);
					}

					$form.find('.has-success')
						.removeClass('has-success');
						
					$submitButton.val( submitButtonText ).attr('disabled', false);

				});

Here’s the result of my submission:
image

The “test.pdf” does not appear on the submission. Where to locate it?

Thank you very much!

Hiya, @LanceDdot :wave:

Sorry you are having trouble getting your forms to work!

Before diving in, I just want to make sure you have seen some of our resources. This Support Guide is the first port of call to debug any forms issues. Did you read through this and work through the suggestions? There are also many other Support Guides for forms - you can find them here: #Netlify-support:support-guides

We also recommend trying to search the forums or look at topics tagged Netlify forms if you haven’t already - it’s likely your question was already asked by someone else!

If you are still having problems, please provide the information we ask for at the bottom of the Support Guide (also outlined below):

  1. The URL for your live form as you want visitors to use it
  2. The URL of your deployed html form. In case you have a javascript form, we need to literally be linked to the html version you’ve deployed, as mentioned above (look for “ pure javascript form ”)
  3. The form name that you’ve set and that shows in our UI
  4. Any errors or logs from the Netlify build logs, dashboard or browser developer console
  5. Description of anything you have tried that did or didn’t help or make things better/worse

Greetings, Hillary!

No worries. I managed to fix the form on my end. I edited my Form validation (JavaScript) that prevents sending an attachment.

It’s my mistake, in other words. :sweat_smile:

Thank you for your concern. God bless.