SharePoint Upload File to Document Library using Client Side Object Model

"use strict";

var JJ = window.JJ || {};
JJ.Jsom = JJ.Jsom || {};

JJ.Jsom.Libs = function () {

    var deferreds = new Array(),

    upload = function (library, filename, file) {
        deferreds[deferreds.length] = $.Deferred();
debugger;
        getFileBuffer(file).then(
            function (buffer) {
                var bytes = new Uint8Array(buffer);
                var content = new SP.Base64EncodedByteArray(); //base64 encoding
                for (var b = 0; b < bytes.length; b++) {
                    content.append(bytes[b]);
                }
                var ctx = new SP.ClientContext.get_current();

var oList = ctx.get_web().get_lists().getByTitle(library);

fileCreateInfo = new SP.FileCreationInformation();
fileCreateInfo.set_url(filename);
fileCreateInfo.set_content(content);
fileCreateInfo.set_overwrite(true);
               
this.newFile = oList.get_rootFolder().get_files().add(fileCreateInfo);

ctx.load(this.newFile);
ctx.executeQueryAsync(
Function.createDelegate(this, function(){alert('Done');}),
Function.createDelegate(this, function(){alert(arguments[1].get_message());})
);

            },
            function (err) {
                deferreds[deferreds.length - 1].reject(err);
            }
         );

        return deferreds[deferreds.length - 1].promise();

    },

    getFileBuffer = function (file) {
        var deferred = $.Deferred();
var reader = new FileReader();
reader.onload = function (e) {
deferred.resolve(e.target.result);
}
reader.onerror = function (e) {
deferred.reject(e.target.error);
}
reader.readAsArrayBuffer(file);
return deferred.promise();
    };

    return {
        upload: upload,
    };

}();

$(document).ready(function(){
SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function(){});
$("#s4-bodyContainer").prepend('<input id="inputFile" type="file" /><input id="uploadDocumentButton" type="Button" value="Upload Document"/>');

$("#uploadDocumentButton").unbind('click').click(function () {
debugger;
if (document.getElementById("inputFile").files.length === 0) {
alert("Select a file!");
return;
}

var parts = document.getElementById("inputFile").value.split("\\");
var filename = parts[parts.length - 1];
var file = document.getElementById("inputFile").files[0];

JJ.Jsom.Libs.upload("Documents", filename, file);
});
});

Read More