how to submit form after deferred.then on an array

I have svgs on a page that are being converted to canvas and then posts the html2canvas data successfully. The trouble I am having is having the form submit after posting the html2canvas data. I have tried to simply use

$('#chartInfo').submit()

in the AJAX success, but that does not execute. So, I tried to play with deferred below and that tries to submit the form for each element in the array. I am not sure where I am going wrong here.

$(document).ready(function() {

    $( '#save_dashboard' ).click(function() {

        // Declare an array to store all deferred objects from each svg element
        var svgDfds = [],
            targetElem = $('#contentzone-outer');
        var dfdDashboardPngs = [];

        targetElem.find('svg').each(function() {
            var dfd = new $.Deferred(),
                svg = $(this),
                canvas = $('<canvas></canvas>');

            svg.replaceWith(canvas);

            // Get the raw SVG string and curate it
            var content = svg.wrap('<p></p>').parent().html();
            content = content.replace(/xlink:title='hide\/show'/g, '');
            content = encodeURIComponent(content);
            svg.unwrap();

            // Create an image from the svg
            var image = new Image();
            image.src = 'data:image/svg+xml,' + content;
            image.onload = function() {
                canvas[0].width = image.width;
                canvas[0].height = image.height;

                // Render the image to the canvas
                var context = canvas[0].getContext('2d');

                // Resolve or reject the deferred
                dfd.resolve(context.drawImage(image, 0, 0));
            };

            // Push deferred object into array
            svgDfds.push(dfd);

        }); // end of targetElem.find('svg').map(function() {...});

        // Check for all deferreds
        $.when.apply($, svgDfds).then(function(_canvas) {
            console.log('dfd done', _canvas);

            // http://ift.tt/181n9K8
            $('#contentzone-outer').html2canvas({
                onrendered: function (canvas) {
                    //Set dashboardPng value to image data (base-64 string)
                    var dashboardPng = canvas.toDataURL('image/png');
                    console.log('dashboardPng: ' + dashboardPng);
                    var dfd2 = new $.Deferred();

                    $.ajax({
                        url:'save_dashboard_image.php',
                        data:{dashboardPngData: dashboardPng},
                        type:'POST',
                        dataType:'json',
                        success: function(){
                            dfd2.resolve(console.log('success'));
                        }
                        ,
                        error: function(xhr, status, error){
                            console.log('The requested page was: ' + document.URL +
                                '. The error number returned was: ' + xhr.status +
                                '. The error message was: ' + error);
                        }

                    })
                    .always(function(){
                        // Push deferred object into array
                        dfdDashboardPngs.push(dfd2);
                    })
                    ; // end of save_dashboard_image.php
                } // end of html2canvas
            }); // end of onrendered
        }); // end of $.when.apply($, svgDfds).then(function(_canvas) {...}

        // Check for all deferreds
        $.when.apply($, dfdDashboardPngs).then(function() {
                $('#chartInfo').submit();
        });

    }); // end of save_dashboard click function
}); // end of document ready