Sign up ×

I need to upload image file to SharePoint 2010 picture library using javascript.

The requirement is:

  1. We have File Upload control

  2. Ee have to upload image file from that file upload control

My code is attached below, but does not work.

If anybody has a better solution that would be nice.


function updateListItem() 
var clientContext = new SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle('Test');
var itemCreateInfo = new SP.ListItemCreationInformation();
this.oListItem = oList.addItem(itemCreateInfo);
oListItem.set_item('Title', My Image);


function onQuerySucceeded() 

alert('Item updated!');


function onQueryFailed(sender, args) 




<input id="FileUpload" type="File" /><br />
<br />
<input onclick="updateListItem()" id="UploadImage" type="submit" value="Upload" />
share|improve this question

1 Answer 1

Uploading files in general is not easy in JavaScript as far as I know.

You could use the FileReader API with a polyfill, Jahdrien/FileReader.

Or you could attach an ajax uploader such as valums/ajax-upload to the existing picture gallery upload form (/_layouts/Upload.aspx?IsDlg=1&List=<your list guid>).

share|improve this answer
I am able to add an item to the custom list but not able to upload a file into it.I have written following code for reading a file in java script but got "Undefined object" exception for 'File' -- var oList = clientContext.get_web().get_lists().getByTitle('Test'); var fStream = File.OpenRead(uploadimagepath); var newPic = oList.RootFolder.Files.Add(phototitle, fStream); –  Lalit Kumar Mishra Sep 27 '12 at 7:05
You get that because you don't have the native function File on window (global object), you can see which browsers support this on caniuse. This is why I mentioned polyfills. –  eirikb Sep 27 '12 at 7:08
I can not use build in API... –  Lalit Kumar Mishra Sep 27 '12 at 7:11
If you have any other approach using java script then it might be helpful. –  Lalit Kumar Mishra Sep 27 '12 at 7:13

Your Answer


