1

I have the following form in my code which needs to be submitted in order to send a email to the client :-

    <form  enctype="multipart/form-data" id="jobapplication">
              <div class="form-group">
              <input type="email" class="form-control" aria-describedby="email Help" placeholder="Email Id *" name="email" required> <!--Input field for email-->
              </div>
               <div class="form-group">
              <input type="text" class="form-control" aria-describedby="Name Help" placeholder="Name *" name="name" required>   <!--Input field for name-->
               </div>
                <div class="form-group">
              <input type="phone" class="form-control" aria-describedby="Phone Help" placeholder="Phone *" name="phone" required> <!--Input field for phone-->
               </div>
                <div class="form-group">
              <input type="file" class="form-control" aria-describedby="Resume Help" placeholder="Resume" name="resume" required>  <!--Input for selcting resume-->
               </div>
                 <div class="form-group">
              <input type="text" class="form-control in-position " aria-describedby="email Help"  name="position" readonly> <!--Displaying the position applied-->
                 </div>
                 <div class="form-group">
                     <div class="g-recaptcha" data-sitekey="6LcpH3YUAAAAABF4UFt9WoLsrgug0wZ3O8zK0t_9"></div>
                 </div>
               <div class="form-group text-center">
                  <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button> <!--the cancel button-->
                  <button type="sumbit" class="btn btn-primary">Apply</button>  <!--the apply button-->
                </div>
             </form>

and the following javascript code to read the formdata using FormData and ajax

$(document).ready(function(){
       $('#jobapplication').submit(function(e){
           e.preventDefault();
           var fr=$('#jobapplication')[0];
           var form=new FormData(fr);

           $.ajax({
              type:'POST',
              url:'apply',
              data:form,
              dataType:'json',
              cache: false,
            contentType: false,
            processData: false
           }
             )
          .done(function(data)
          {
                if(data.info=="success")
                    {
                        window.location.href='/end';
                    }
           })
           .fail(function(data)
             {
               alert(data.err);
           })
           .always(function(data)
            {
               $('input[name=name]').val('');
               $('input[name=email]').val('');
               $('input[name=phone]').val('');
               $('input[name=resume]').val('');   
               grecaptcha.reset();   
           });
       }); 
    });

but on running i'm getting the following error :- undefined in the alert dialog box can any body tellme how to read the file from this form and then use it to sumbit the data?

atul kumar
  • 55
  • 6
  • You're not calling `.append` anywhere in your code. Please post all the code we will need to be able to solve your problem – Jack Bashford Nov 06 '18 at 00:02
  • 2 issues, url is a "apply", and dataType:'json', just send the formdata as is and it should work. If you really want it to be json you need to read the filedata using the filereader api. – Paul G Mihai Nov 06 '18 at 00:02
  • @JackBashford this is the whole code and i'm getting this annoying response again and again ,any solution for that ? – atul kumar Nov 06 '18 at 00:05
  • @PaulGMihai i have done same with the another route and it worked there but it is not wroking here as i'm using formdata for taking the upload file any other way to get the upload file data ? – atul kumar Nov 06 '18 at 00:08
  • `processData: false` jQuery will try to serialize your FormData otherwise. – Kaiido Nov 06 '18 at 06:46

0 Answers0