5

I am creating a visual web-part for my SharePoint 2013 environment. I am using asp:FileUpload control(fuBrowseXMLFile) in this web-part for uploading files to a document library. I have a button Save to initiate the process of uploading the file.

After deploying the code, i try to run it in Debug mode. I found that after clicking the Save button, when the debugger hits the following line of code,

if (fuBrowseXMLFile.HasFile)

fuBrowseXMLFile.HasFile returns FALSE. Whereas the file is selected in the control.

While searching for a solution, I came across lot of articles. But, unfortunately most of them talk with reference to UpdatePanel. I am not using UpdatePanel here.

I understand that it has to do something with Postback. But, I am not sure what would exactly resolve my problem.

  • Check EnableViewState="true" is set for the fileupload control. – Amal Hashim Dec 30 '14 at 0:37
  • @Amal it didn't helped. – Amit Tyagi Dec 30 '14 at 0:57
  • Add this Page.Form.Attributes.Add("enctype", "multipart/form-data"); in Page_Load event. – Amal Hashim Dec 30 '14 at 1:04
  • I already have it. Got this suggestion while googling. But sadly it didn't worked. – Amit Tyagi Dec 30 '14 at 1:13
  • Is your file upload control in Update panel? – Kaushal Khamar Sep 16 '15 at 6:41
1

Inorder to retain the selection during PostBack you should enable the view state property as below

<asp:FileUpload ID="fuBrowseXMLFile" runat="server" EnableViewState="true"/>

Rest Approach

<input id="inputFile" type="file" >
<input id="uploadDocumentButton" type="Button" value="Upload Document">

$("#uploadDocumentButton").click(function () {
    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];
    uploadFile("ListName", "1", filename, file);            
});

function uploadFile(listName, listId, fileName, file){
    uploadFileSP(listName, listId, fileName, file)
    .then(          
        function (files) {          
            alert("Uploaded successfully");         
        },          
        function (sender, args) {           
            alert(args.get_message());          
        }           
    );          
}

function getFileBuffer(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();
}

function uploadFileSP(listName, id, fileName, file){
    var deferred = $.Deferred();
    getFileBuffer(file).then(
        function(buffer){
            var bytes = new Uint8Array(buffer);
            var content = new SP.Base64EncodedByteArray();
            var binary = '';
            for(var b=0; b<bytes.length; b++){
                binary += String.fromCharCode(bytes[b]);                
            }
            var scriptbase = _spPageContextInfo.webServerRelativeUrl+ "/_layouts/15/";

            $.getScript(scriptbase + "SP.RequestExecutor.js", function(){
                var createitem = new SP.RequestExecutor("https://SharePointURL/SiteCollectionUrl");
                createitem.executeAsync({
                    url: "/SiteCollectionUrl/_api/web/lists/GetByTitle('"+listName+"')/items("+id+")/AttachmentFiles/add(FileName='" + file.name + "')",
                    method: "POST",
                    binaryStringRequestBody: true,
                    body: binary,
                    success: fsucc,
                    error: ferr,
                    state: "Update"
                });

                function fsucc(data) {
                    alert('success');
                }

                function ferr(data) {
                    alert('error\n\n' + data.statusText + "\n\n" + data.responseText);
                }
            }); 
        },
        function(err){
            deferred.reject(err);
        }
    );
    return deferred.promise();
}

Source

  • Amal, you are providing an alternate solution here. Do you mean the server side code will not work in this scenario ? If Yes, what explanation do you have in support of that ? – Amit Tyagi Dec 30 '14 at 0:59
  • I didn't said server side will not work. Since its 2013 I just provided the REST API method. – Amal Hashim Dec 30 '14 at 1:00
  • The reason i don't want to go for REST in this particular situation is that i have already achieved a lot of functionality using server side code. – Amit Tyagi Dec 30 '14 at 1:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.