Upload file

[CyborgDE]

Hello,

how can I upload a file from the local filesystem (FileDialog) ?

Regards, Uwe

[JS-Support @Userware]

Hello Uwe,

The Extensibility features that are coming in early 2016 will let you easily reuse existing JavaScript libraries to display and process upload dialogs. We will post some sample code at that time if we can.

Thanks.
Regards,
JS-Support

[CyborgDE]

Hello,

I need a small peace of code in JavaScript to load a file as a byte[] or to upload a file to the server, can you help ?

Thank you !

Ragards, Uwe

[Mark Stega]

I have a C# implementation (Silverlight) of the file upload methodology shown in this http://www.codeproject.com/Articles/51331/Silverlight-MVVM-Lib-and-FileUploader-Using-HttpHa. If this would be of use you can shoot an email to mark2002 AT stega DOT us and I can send you the code. I know it isn't exactly what you are looking for but it might serve as a starting point.

[CyborgDE]

Hello,

thank you.
The main problem was, to open the filedialog and get the values back to the code.
I have a button, which calls the UploadFile() ...

At the moment, this is the code (not perfect, but good for now) :

Code: Select all

using System;
using System.Reflection;

#if CSHTML5
using Windows.UI.Xaml;
#else
using System.Windows;
using System.Windows.Controls;
#endif

namespace SEP.Controls
{
#if CSHTML5
    public class FileButton : FrameworkElement
    {
        public FileButton()
        {
            // Specify the HTML representation of the control
            CSharpXamlForHtml5.DomManagement.SetHtmlRepresentation(this, ""
                                    + "<form action=\"\" method=\"post\" enctype=\"multipart/form-data\">\n"
                                    + "<input type='file' align='left'>\n"
                                    + "<div align=\"center\">\n"
                                    + "<progress value='0' style=\"margin-top:4px\" />\n"
                                    + "</div>\n"
                                    + "</form>"
            );
        }

        public object UploadFile()
        {
            object result = null;

            // Compilerbefriedigung
            if (result == null)
            {
                object oDom = null;
                PropertyInfo prop = typeof(UIElement).GetProperty("INTERNAL_OuterDomElement", BindingFlags.Instance | BindingFlags.NonPublic);
                if (prop != null)
                {
                    oDom = prop.GetValue(this);
                }
                result = "";
                JSIL.Verbatim.Expression(""
+ "    var file = oDom.children[0].files[0]; \n"
+ "    var formData = new FormData(); \n"
+ "    var client = new XMLHttpRequest(); \n"
+ "    var prog = oDom.children[1].children[0]; \n"
+ "     if(!file) \n"
+ "        return; \n"
+ "    if (prog != null) { \n"
+ "      prog.value = 0; \n"
+ "      prog.max = 100; \n"
+ "      prog.style.visibility = \"visible\"; \n"
+ "    } \n"
+ "    result = file.name;"
+ "    formData.append(\"datei\", file); \n"
+ "    client.onerror = function(e) { \n"
+ "        alert(\"Error upload !\"); \n"
+ "    }; \n"
+ "    client.onload = function(e) { \n"
+ "        if (prog != null) { \n"
+ "            prog.value = 100; \n"
+ "        }; \n"
+ "    }; \n"
+ "    if (prog != null) { \n"
+ "       client.upload.onprogress = function(e) { \n"
+ "            var p = Math.round(100 / e.total * e.loaded); \n"
+ "           var prog1 = oDom.children[1].children[0]; \n"
+ "           prog1.value = p; \n"
+ "           if (e.total === e.loaded) { \n"
+ "              prog.style.visibility = \"collapse\"; \n"
+ "           }; \n"
+ "       }; \n"
+ "    }; \n"
+ "      client.onabort = function(e) { \n"
+ "        alert(\"Upload abgebrochen\"); \n"
+ "      }; \n"
+ "    client.open(\"POST\", \"upload.php\"); \n"
+ "    client.send(formData); \n"
                    );
            }
            return result;
        }
    }
#else
   public class FileButton : Button
   {

      public static string TargetDir = "Upload";

      public FileButton()
      {
         RefreshContent();
      }

      protected void RefreshContent()
      {
         string fName = System.IO.Path.GetFileName(FileName);
         if (fName.Length > 20)
         {
            fName = fName.Substring(0, 20) + "...";
         }
         Content = "Durchsuchen (" + fName + ") ...";
      }

      public string FileName = "";

      protected override void OnClick()
      {
         base.OnClick();

         FileName = "";

         // Configure open file dialog box
         Microsoft.Win32.OpenFileDialog dlg = new Microsoft.Win32.OpenFileDialog();
         dlg.FileName = "Document"; // Default file name
         dlg.DefaultExt = ".*"; // Default file extension
         dlg.Filter = "Alle Dateien|*.*"; // Filter files by extension
         dlg.RestoreDirectory = false;

         // Show open file dialog box
         Nullable<bool> result = dlg.ShowDialog();

         // Process open file dialog box results
         if (result == true)
         {
            // Open document
            FileName = dlg.FileName;
            RefreshContent();
         }
      }

      public object UploadFile()
      {
         if (! string.IsNullOrEmpty(FileName)){
            string toFName = System.IO.Path.GetFileName(FileName);
            if (!string.IsNullOrEmpty(TargetDir))
            {
               if (!System.IO.Directory.Exists(TargetDir))
               {
                  System.IO.Directory.CreateDirectory(TargetDir);
               }
               toFName = System.IO.Path.Combine(TargetDir, toFName);
            }
            System.IO.File.Copy(FileName, toFName);
         }
         return FileName;
      }
   }
#endif
}


Regards Uwe

PS: Are you the Author of the CodeProject article ?

[Mark Stega]

No, I am not the author; I just used the article as the basis for the code that I wrote to accomplish the same type of transfer.