Fine Uploader - the noFilesError don't show - fine-uploader

var manualuploader = new qq.FineUploader({
element: $('#manual-fine-uploader')[0],
request: {
endpoint: '/ViewData/UploadFile'
},
autoUpload: false,
multiple: false,
validation: {
allowedExtensions: ['xlsx']
},
text: {
uploadButton: 'select file',
cancelButton: 'cancel file'
},
messages: {
typeError: '{file} file type error : {extensions}.',
noFilesError: "no files ."
},
failedUploadTextDisplay: {
mode: 'custom',
maxChars: 40,
responseProperty: 'Msg',
enableTooltip: true
},
callbacks: {
onUpload: function (id, name) {
showWaitLayer("uploading ......");
},
onComplete: function (id, name, response) {
closeWaitLayer();
$('input[name=uploadFileName]').val(response.Datas.FILE_0);
}
}
});
I use this code , when i select a 'jpg' file,the typeError will alter;
my question is when the noFilesError will show? i try lots time the noFileError didn't show.

finally,i update to 3.64 version,and before uploadStoredFiles() method i add
var tempA = manualuploader.getUploads({
status: [qq.status.SUBMITTED]
});
if (tempA.length == 0){
alert("no File Error");
return;
}

The documentation on options clearly states:
noFilesError - Text sent to the onError callback (and showMessage if running in FineUploader mode) if a an empty array of files or Blob objects is submitted.
And on callbacks:
onError(String id, String name, String errorReason, XMLHttpRequest xhr) - called whenever an exceptional condition occurs (during an upload, file selection, etc). Note that the last parameter, xhr, will only be included if the error is related to a request initiated by XMLHttpRequest.
If you simply want an error to display when no files have been droppped onto the uploader, add an anonymous function to your onError callback like so:
// ...
callbacks: {
onError: function (id, name, errorReason, xhr) {
alert(errorReason);
}
}
// ...
This will display a simple alert whenever there is an error. You could customize when and how you display your error by manipulating the logic inside of the onError callback.

Related

Custom success message on FilePond file upload

I’m using FilePond 4.30.4 with React and react-filepond 7.1.2. Everything is working great and I can upload files.
My server responds with a file ID, and this comes back down to FilePond. I can see it in the onprocessfile event.
I’d like to include this is the ‘Upload Complete’ message. e.g. ‘Complete, file 12345’. How can I set this?
I’ve tried to update .labelFileProcessingComplete in onprocessfile, but it has no effect. I can see my events being fired and the correct data in the console. Perhaps there is another way to update the 'Upload Complete' label with a custom message for the file.
<FilePond
ref={filePondRef}
oninit={() => handleInit()}
files={files}
onupdatefiles={setFiles}
onprocessfile={ (error, file) => {
if (error) {
console.log('OnProcessFile: we have an error:' + error);
console.dir(error);
return;
}
console.log('OnProcessFile:File processed', file);
console.log('OnProcessFile:set processed message to ', file.serverId);
//This has no effect
filePondRef.current.labelFileProcessingComplete='Completed:-#' + file.serverId;
}
}
labelIdle='Drag & Drop your files or <span class="filepond--label-action">Browse</span>'
server={ {
timeout: 7000,
process: {
url: apiUrl,
method: 'POST',
withCredentials: false,
timeout: 7000,
onload: (res) => {
console.log('onload:and label with res=' + res);
// this has no effect either
filePondRef.current.labelFileProcessingComplete='Completed:' + res;
return res;
}
}
}
}
labelFileProcessingError= {() => {
// replaces the error on the FilePond error label
console.log('labelFileProcessingError: serverResponse is:' + serverResponse );
return serverResponse;
}}
/>

How to display custom error message automatically on Dropzonejs?

In php if I can't find a specific key I exit with a message. With the default Dropzone settings, this message is shown when the user hovers over the error X. How can I trigger this error message to display without getting the user to hover over it?
// php
$msg = "Sorry!";
exit($msg);
// dropzone JavaScript in html
Dropzone.options.dropPhotosForm = {
paramName: "file",
maxFilesize: 20,
acceptedFiles: 'image/jpg, image/jpeg, .jpg, .png, .jpeg',
parallelUploads: 1,
error: function(file, response) {
console.log(response); // "Sorry"
}
};
you can play with opacity a little bit.
Something like:
error: function (file, error) {
if (file && error) {
var msgEl = $(file.previewElement).find('.dz-error-message');
msgEl.text(error.message);
msgEl.show();
msgEl.css("opacity", 1);
}
}

Meteor SimpleSchema: prevent form submission using asynchronous custom validation

I have implemented a custom validation function using the example referenced in the SimpleSchema documentation for validating the uniqueness of a username. In the example, an asynchronous call is made and a custom validation message is displayed if the username is found to already exist.
There is a note, that indicates that if all of the form fields are valid, the form will be submitted, however user creation will fail due to the "unique: true" requirement specified in the schema. Here is the relevant portion of the code from the example docs:
username: {
type: String,
regEx: /^[a-z0-9A-Z_]{3,15}$/,
unique: true,
custom: function () {
if (Meteor.isClient && this.isSet) {
Meteor.call("accountsIsUsernameAvailable", this.value, function (error, result) {
if (!result) {
Meteor.users.simpleSchema().namedContext("createUserForm").addInvalidKeys([{name: "username", type: "notUnique"}]);
}
});
}
}
}
In my case, I have the code working where I am testing if an activation code is valid, I even get the interface to display the error, however since there is no other "schema" failure, the form submits, despite the invalid response... do I need to manually prevent form submission (i.e. using jQuery), or is there something in SimpleSchema I should use instead?
activationCode: {
type: String,
label: "Activation Code",
max: 200,
min: 10,
regEx: /^(?=.*[A-Z])(?=.*\d).+$/,
custom: function() {
if (Meteor.isClient && this.isSet) {
Meteor.call("validateActivationCode", this.value, function(error, result) {
if (result && !result.isValid) {
Clients.simpleSchema().namedContext("signupForm").addInvalidKeys([{
name: "activationCode",
type: "notValid"
}]);
return false;
}
});
}
}
}
Thank You

FineUploader Pause if PDF

I would like to pause fineuploader if the document dropped is a pdf to give the end user some options before continuing. I cannot figure out how to get the pause to trigger. I am getting [Fine Uploader 5.3.2] Ignoring pause for file ID 0 (DEVELOPMENT.PDF). Not in progress.
My code below.
var uploader = new qq.s3.FineUploader({
debug: true,
element: document.getElementById('fine-uploader'),
request: {
endpoint: 'bucketname.s3.amazonaws.com',
accessKey: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ' //zone-user key id
},
signature: {
endpoint: "/assets/plugins/fine-uploader/signature/endpoint.php"
},
debug:true,
cors: {expected: true},
chunking: {enabled: true},
resume: {enabled: true},
deleteFile:{enabled:false},
validation: {
itemLimit: 5,
sizeLimit: 15000000
},
uploadSuccess:{
//endpoint:"/assets/plugins/fine-uploader/signature/endpoint.php?success"
},
callbacks: {
onSubmitted: function(id, name) {
var fileName = name;
var fileExtension = fileName.substring(fileName.lastIndexOf('.') + 1).toUpperCase();
if(fileExtension==='PDF'){
alert('it IS pdf... now what?');
jQuery('#confirmPDFHandler').modal();
uploader.pauseUpload(id); //not pausing here
}else{
alert('its not a pdf... go!');
uploader.continueUpload(id);
}
},
onError: function(id, name, errorReason, xhrOrXdr) {
//alert(qq.format("Error on file number {} - {}. Reason: {}", id, name, errorReason));
},
onUpload: function(id, name, isError,responseJSON) {
var obj = JSON.stringify(responseJSON);
//alert(name + 'is in progress');
},
onComplete: function(id,fileId,responseJSON){
var newfilename=uploader.getKey(id);
}
},
retry: {enableAuto: false}
});
If the user drops a pdf in the uploader, we will give them an option to simply upload (continue as usual) or split the file (pause or stop the upload and run our separate custom code to begin the pdf split option pulling one document into multiple documents then passing those to an uploader)
Sounds like you want to potentially cancel the upload, or proceed. In that case, you should ask the user for input inside of an onSubmit or onValidate event handler. Your handler should return a Promise and either resolve the promise to allow the file to go through, or reject it to cancel the file submission. For example:
onSubmit: function(id) {
return new Promise(function(resolve, reject) {
// popup modal
// when user responds...
// ...call resolve() if they want to upload the file
// ...or reject() if they want to cancel the file
});
}
Fine Uploader has a very small "promise" implementation bundled with the library. It's non-standard, so you may be better off finding a standard A+ implementation instead.

Can I use Loopback Model Validations only when a property is certain value

I have a "post"-model in strongloop loopback with some properties:
title
text
tags
category
published (true or false)
Is it possible to use the model validations in strongloop loopback, but only when I want to publish the post, not when I save it?
Set up a custom post.saveOrPublish() remote method that only calls post.isValid() when post.publish === true. Or use the built-in persistedModel.save() for everything without validation and use a custom post.publish() remote method for when you actually click the publish button, which would trigger your validation code before calling save().
saveOrPublish example: (not tested, just a rough idea):
module.exports = function(Post) {
Post.saveOrPublish = function(post, cb) {
if(post.publish) {
post.isValid(function(valid){
if(valid) {
Post.upsert(post, function(err, post) {
if(err) {cb(err, null);}
cb(null, post);
});
} else {
cb(new Error('Publishing requires a valid post.'), post)
}
});
} else {
Post.upsert(post, function(err, post) {
if(err) {cb(err, null);}
cb(null, post);
});
}
};
// don't forget the remote method def
Post.remoteMethod('saveOrPublish',
{
accepts: [{
arg: 'post',
type: 'object'
}],
returns: {
arg: 'result',
type: 'object'
},
http: {verb: 'post'}
}
);
};

Resources