Question

I’m building a form with JQuery and PHP and everything seem to work accept the file upload. Json doesn’t seem to like the $_FILES. The form uploads fine when javascript is turned off. Is this a known issue? If it is, is there a work around? How do JQuery plugins manage to do this?

Thank you!

JQUERY:

$('#mcContactForm').submit(function(e){
    e.preventDefault();

    // validate form
    mcValidateForm();

    // serialize and submit form data
    $('.mcloading').show();
    var mcFormData = $(this).serialize();
    mcSubmitForm(mcFormData);

    // -----------------------------------------------
    // AJAX FORM SUBMIT
    // -----------------------------------------------
    function mcSubmitForm(mcFormData){
        $.ajax({
            type: 'POST',
            url: 'contact.php',
            data: mcFormData,
            dataType: 'json',
            cache: false,
            timeout: 7000,
            success: function(data) {
                if(data.error === true){

                    ...
                }
                else if(data.error === false){

                    ...
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert(errorThrown);
                ...
            },              
            complete: function(XMLHttpRequest, status) { 
                ...
            }
        });
    }
});

Answer 1

It sounds like maybe you are trying to upload files via ajax and discovering that this can’t be done by simply sending the form parameters back via regular ajax? If so, what you need is an ajax file upload plugin. See here for some possibilities:

http://www.webdeveloperjuice.com/2010/02/13/7-trusted-ajax-file-upload-plugins-using-jquery/

These typically use a system of submitting to hidden iframes to do the uploads.