Databases
StackOverflow2013
Postsdbo
POblueimp's fileupload angular version, binding custom callback
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POblueimp's fileupload angular version, binding custom callback
    primarykey
    data
    text
    <p>I'm using the angularJS version (V2.1.2) of Blueimp's famous fileupload JQuery plugin with the PHP backend. Very nice piece of code. I customized it with some additional form controls and selector, as well as a custom UploadHandler by extending the provided class, in order to record stuff in a database. Everything works fine so far.</p> <p>However, I have trouble binding a custom callback to the 'fileuploadsubmit' event. It's described in <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/Options#callback-options" rel="nofollow">https://github.com/blueimp/jQuery-File-Upload/wiki/Options#callback-options</a> for JQuery, but I can't seem to make it work with the AngularJS implementation. The aim would be for me to submit the additionnal field "doctypes[]" that I tied to each individual upload.</p> <p>Here is the extract of the added field:</p> <pre><code> &lt;td class="type" data-ng-switch data-on="!!file.url"&gt; &lt;label data-ng-switch-when="false" data-ng-show="!file.error"&gt; &lt;select data-ng-model="docTypeId" ng-options="item.value as item.name for item in documentTypes | orderBy:'name'" required="required" name="doctypes[]"&gt; &lt;option value="" selected&gt;Document type&lt;/option&gt; &lt;/select&gt; &lt;/label&gt; &lt;label data-ng-switch-default&gt;&lt;!-- here, find a way to display the value submited to the plugin. {{file.doctypes}} is not defined --&gt; &lt;/label&gt; &lt;/td&gt; </code></pre> <p>Note: the documentTypes comes from my angularJS app, it is currently statically defined in the main controller.</p> <p>So this additionnal field is properly posted to the uploadhandler, but I would like the plugin to receive it, and send it back in the JSON response, so as to change the layout and fix the selector to the value it had before the upload.</p> <p>I consider myself a beginner in AngularJS, so maybe I don't have a clear and detailed grasp on the technical bits on how to do this properly.</p> <p>Any help would be appreciated.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USMarc
    1. USMarc
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. POblueimp's fileupload angular version, binding custom callback
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWith further research and testing, I was able to properly bind the event in my controller like so: $scope.$on('fileuploadsubmit', function (event, files) { ...do stuff... }); However I cannot access attributes from the fileupload directive. I have the feeling that I should start digging around the emit/broadcast events of the fileupload directive's scope... passing the $rootScope in my controller didn't help.
      singulars
      1. POblueimp's fileupload angular version, binding custom callback
      1. USMarc
    2. COUsing this module: [angular-file-upload](https://github.com/danialfarid/angular-file-upload) might save you some hassle and make your code simpler. Have a look at the readme file, it's pretty straightforward.
      singulars
      1. POblueimp's fileupload angular version, binding custom callback
      1. USdanial
    3. COThanks, I'll have a look. However I must say that although your implementation is easier to follow, I quite like the hardened security of Blueimp's one and the multiple options to customize it.
      singulars
      1. POblueimp's fileupload angular version, binding custom callback
      1. USMarc
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload