Lists.asmx and List Item Attachments

Question

How would the lists.asmx service be used to add an attachment to a list item with JavaScript File API?

I cannot find an example of anything other than copy.asmx for adding documents.

Update: Here is the code I am using. I have tried the FQDN of the server and the short form as in the code. I'm not sure what is going on but the error is:

<?xml version="1.0" encoding="utf-8"?>
    <soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
        <soap:Body>
            <soap:Fault>
                <faultcode>soap:Server</faultcode>
                <faultstring>Exception of type 'Microsoft.SharePoint.SoapServer.SoapServerException' was thrown.</faultstring>
                <detail>
                    <errorstring xmlns="http://schemas.microsoft.com/sharepoint/soap/">The security validation for this page is invalid. Click Back in your Web browser, refresh the page, and try your operation again.</errorstring>
                    <errorcode xmlns="http://schemas.microsoft.com/sharepoint/soap/">0x8102006d</errorcode>
                </detail>
            </soap:Fault>
        </soap:Body>
    </soap:Envelope>

Code sample:

<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
    <soap:Body>
        <AddAttachment xmlns="http://schemas.microsoft.com/sharepoint/soap/">
            <listName>MarketNeed</listName>
            <listItemID>1</listItemID>
            <fileName>test.txt</fileName>
            <attachment>dGVzdA==</attachment>
        </AddAttachment>
    </soap:Body>
</soap:Envelope>


var soapPayload = '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"><soap:Body><AddAttachment xmlns="http://schemas.microsoft.com/sharepoint/soap/"><listName>MarketNeed</listName><listItemID>1</listItemID><fileName>test.txt</fileName><attachment>dGVzdA==</attachment></AddAttachment></soap:Body></soap:Envelope>';


$.ajax({
    url: "http://dev/sites/plm/_vti_bin/lists.asmx",
    type: "POST",
    dataType: "xml",
    data: soapPayload,
    complete: function(){ console.log("Done"); },
    contentType: "text/xml; charset=\"utf-8\""
});

Answer 1

You'd have to use the AddAttachment method of the Lists.asmx web service I believe. SO you'd first create the list item and in the response from that, it should tell you the list item ID which you can then pass into the AddAttachemnt method.

Edit from OP:

Here is the code I developed using PirateEric's suggestion. I needed to use SPServices, as I could not seem to get the service to accept my POST. If you look at their code I am sure the single method could be implemented so as to avoid the weight of the entire library.

<img src="attachment-icon.png" id="SECRET-000234-attachment" class=".attachment-target" />

$('.attachment-target').each(function(){
    this.ondragover = function () { return false; };
    this.ondragend = function () { return false; };
    this.ondrop = function (e) {
        e.preventDefault();
        var itemInfo = this.id.split("-");
        var listName = plm.lists.byConfidentiality(itemInfo[0]).getMarketneedList();
        //The above code is a custom object that returns
        //the list name based on the "confidentiality"
        //of the item. We use 4 different lists to easily
        //manage the permissions. All perms are at teh list
        //level only.
        var itemId = parseInt(itemInfo[1]);


      var file = e.dataTransfer.files[0],
          reader = new FileReader();
      //In prod this would be in a for loop, of course.
      reader.onload = function (event) {
        $().SPServices({
            operation: "AddAttachment",
            listName: listName,
            listItemID: itemId,
            fileName: file.name,
            attachment: event.target.result.split(",")[1],
            completefunc: function (xData, Status) {
                                     //Do stuff
            }
          });
      };
          return false;


};
});

Answer 2

Add the soap action parameter and its value, it will resolve your error.