使用Ajax和laravel上传图像

Question

我在我的laravel projecto中工作，我正在使用ajax，但我在其中一个字段中有一些问题，输入文件，ajax没有发送或检测文件输入字段，它从其他inptus字段发送数据但不是这里的文件是我上面的代码：

$('#savePersonalData').click(function(event) {
            event.preventDefault();
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },

                method: 'PUT',
                url: '{{url('personaldata')}}/{{$user->id}}',
                data: $( '#personalDataForm' ).serialize()


            }).done(function(response){
                //console.log(JSON.stringify(response));
                console.log(response);
            }).fail(function(response) {
                console.log(response.responseJSON);
            });

        });

HTML：

some inputs fields (text, options,etc)...
 <div style="text-align: right;" class="col-md-4 ">
                                <div id="image-preview">
                                    <label for="image-upload" id="image-label">Foto Perfil</label>
                                    <input type="file" name="avatar" id="image-upload" />
                                </div>

                            </div>