New Post: AddAttachment

I noticed that method just a month ago while helping my colleague with this script. I've confirmed this works with .csv's and .txt files. Although, this doesn't answer your input type='file' question, it is production code. :)

YMMV

<div>
    <p> testing attaching a csv file to a SP List item
    <input type='button' value="Attach File Test" onclick='javascript:attachFileText();' />
    <br />

    <div id="output" style="border: solid 1px #000000;"></div>
</div>

<!-- Change file paths below to where you are hosting your jquery files -->
<script src='/hr/SiteAssets/jquery-1.8.3.min.js' type='text/javascript'></script>
<script src='/hr/SiteAssets/jquery.SPServices-0.7.2.min.js' type='text/javascript'></script>
<script >

    // Took JS from:
    // http://spservices.codeplex.com/
    // http://spservices.codeplex.com/discussions/221435
    // http://spservices.codeplex.com/wikipage?title=Lists&referringTitle=%24%28%29.SPServices
    // Tested on SharePoint online site
    
    // Sample JS Method to attach file to a list item that already exists
    function attachFileText()
    {
      // for brevity, left out code that builds csvData...

      var fileContent = csvData;
      var SPwebURL = "http://client.sharepoint.com/"; // optional 
      var SPlistName = "History";
      var id = 236; // picked an arbitrary List ID value
      // optional argument: webURL: SPwebURL,
      $().SPServices({
         operation: "AddAttachment",
         listName: SPlistName,
         listItemID: id,
         fileName: 'logs.csv',
         attachment: Base64.encode(fileContent),
         async: false,
         completefunc: function(xData, Status)
         {
          // log the data to the console
          console.log(xData.responseText);
          // or write some output to our html page
          $('#output').html("done! + status = " + Status + ", message = " + xData.responseText);
         }
       });
    }

    // Routines to encode file contents so that the SOAP request stays in a valid XML format
    // Javascript base64
    // http://www.webtoolkit.info/javascript-base64.html
    
var Base64 = {
  // private property
  _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

  // public method for encoding
  encode : function (input) {
          var output = "";
          var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
          var i = 0;
          input = Base64._utf8_encode(input);
          while (i < input.length) {
                  chr1 = input.charCodeAt(i++);
                  chr2 = input.charCodeAt(i++);
                  chr3 = input.charCodeAt(i++);

                  enc1 = chr1 >> 2;
                  enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
                  enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
                  enc4 = chr3 & 63;

                  if (isNaN(chr2)) {
                          enc3 = enc4 = 64;
                  } else if (isNaN(chr3)) {
                          enc4 = 64;
                  }

                  output = output +
                  this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
                  this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
          }

          return output;
  },

  // public method for decoding
  decode : function (input) {
          var output = "";
          var chr1, chr2, chr3;
          var enc1, enc2, enc3, enc4;
          var i = 0;
          input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
          while (i < input.length) {

                  enc1 = this._keyStr.indexOf(input.charAt(i++));
                  enc2 = this._keyStr.indexOf(input.charAt(i++));
                  enc3 = this._keyStr.indexOf(input.charAt(i++));
                  enc4 = this._keyStr.indexOf(input.charAt(i++));

                  chr1 = (enc1 << 2) | (enc2 >> 4);
                  chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                  chr3 = ((enc3 & 3) << 6) | enc4;

                  output = output + String.fromCharCode(chr1);

                  if (enc3 != 64) {
                          output = output + String.fromCharCode(chr2);
                  }
                  if (enc4 != 64) {
                          output = output + String.fromCharCode(chr3);
                  }

          }

          output = Base64._utf8_decode(output);
          return output;
  },

  // private method for UTF-8 encoding
  _utf8_encode : function (string) {
          string = string.replace(/\r\n/g,"\n");
          var utftext = "";
          for (var n = 0; n < string.length; n++) {
                  var c = string.charCodeAt(n);

                  if (c < 128) {
                          utftext += String.fromCharCode(c);
                  }
                  else if((c > 127) && (c < 2048)) {
                          utftext += String.fromCharCode((c >> 6) | 192);
                          utftext += String.fromCharCode((c & 63) | 128);
                  }
                  else {
                          utftext += String.fromCharCode((c >> 12) | 224);
                          utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                          utftext += String.fromCharCode((c & 63) | 128);
                  }

          }

          return utftext;
  },

  // private method for UTF-8 decoding
  _utf8_decode : function (utftext) {
          var string = "";
          var i = 0;
          var c = c1 = c2 = 0;
          while ( i < utftext.length ) {
                  c = utftext.charCodeAt(i);
                  if (c < 128) {
                          string += String.fromCharCode(c);
                          i++;
                  }
                  else if((c > 191) && (c < 224)) {
                          c2 = utftext.charCodeAt(i+1);
                          string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                          i += 2;
                  }
                  else {
                          c2 = utftext.charCodeAt(i+1);
                          c3 = utftext.charCodeAt(i+2);
                          string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                          i += 3;
                  }
          }
          return string;
  }
}

</script>

Cheers,
Matthew