Skip to end of metadata
Go to start of metadata

In order to upload files into a Servoy solution using a custom webcomponent here are the steps you should do :

    • add a dataprovider type to the component spec, with 'pushToServer' support and 'ondatachange' callback:

      "file": {
          "type": "dataprovider",
          "pushToServer": "allow",
          "ondatachange": { "onchange": "onDataChangeMethodID", "callback": "onDataChangeCallback" }
      }
    • add an  'ondatachange' handler to the component spec:

      "onDataChangeMethodID" : {
          "returns": "boolean", 
      
          "parameters": [
              {
                  "name":"oldValue",
                  "type":"${dataproviderType}"
              },
              {
                  "name":"newValue",
                  "type":"${dataproviderType}"
              },
              {
                  "name":"event",
                  "type":"JSEvent"
              }
          ]
      }
    • add a 'multipart/form-data' 'form' element to the component markup, that will be used to post the files to the server;
      the action of the form must be :  "resources/upload/application_session_id/form_name/element_name/property_name", this can be build up in the component's controller code like : "resources/upload/" + $sabloApplication.getSessionId() + "/" + $scope.$parent.formname + "/" + $attrs.name + "/file" ("file" is the name of the dataprovider from the model):

      <form action="resources/upload/35400153-e5d3-41cb-8032-3b4f91459aca/test/fileupload/file" method="post" enctype="multipart/form-data"> 
    • bind a form variable of type 'media' to the 'file' property of the component, let's say named 'm'; additionally create a form variable of type 'string' with name 'm_filename' and another of the same type named 'm_mimetype', that can be used to get the uploaded file name and mime type;
    • 'ondatachange' of the component will be called with the uploaded file's byte array; if you also created the additional form variables for the file name and mime type, those are already set to the right values of the upload;
  • No labels