通过单击“提交”按钮访问通过FormData传递的数据

Question

I have a form with several input fields including file inputs.I am using jquery validate plugin.I need to submit the form using ajax.

HTML:

<form method="post" name="addstudent" id="registrationform" enctype="multipart/form-data">
some fields
<input type="submit" id="buttontext" 
    class="student_registrationform_button" value="submit" />

Jquery:

$('#buttontext').click(function(){
    $("#registrationform").validate({
           invalidHandler: function(event, validator) {    
          //some code        
    },
 submitHandler: function(form){
            formdata = false;
            if (window.FormData) {
                    formdata = new FormData();
                }
           var i = 0, len = $(".file").length, img, reader, file;
           $('.file').each(function() { var file = this.files[0];
            if (window.FileReader) {
                            reader = new FileReader();
                            reader.readAsDataURL(file);
                     }
                if (formdata) {
                    formdata.append("file", file);
                }
           });
          $.ajax({
                    url:  "process.php",
                    type: 'POST',
                    //data: $(this).serialize(),
                    data: formdata,
                    cache: false,
                    contentType: false,
                    processData: false, 
                    success:function(data){  //alert(data);
                    console.log(data);return false;
          }

Process.php

When I check echo 'action:'.var_dump($_POST); ,its showing null string

Answer 1

    (function($) {
    $.fn.serializefiles = function() {
        var obj = $(this);

        var form_data = new FormData(this[0]);
        $.each($(obj).find('input[type="file[]"]'), function(i, tag) {
            $.each($(tag)[0].files, function(i, file) {
                form_data.append(tag.name, file);
            });
        });

        var params = $(obj).serializeArray();
        $.each(params, function (i, val) {
            form_data.append(val.name, val.value);
        });

        return form_data;
    };
    })(jQuery);


    var form_id = $('#registrationform');


    $.ajax({
        type: "POST",
        url: "process.php",
        data: form_id.serializefiles(),
        cache: false,
        processData: false,
        contentType: false,
        success: function (response) {
            console.log(data);return false;
        }


    });