I am trying to use DropzoneJs.
I have a form with some text fields and a dropzone for file attachments. I did it so that after a file is successfully uploaded to the server (after being automatically processed by dropzone), I'll just add hidden input fields with the filenames as value along with all the other textfield data in the form (for database). However if I have dropped files in the dropzone and has been successfully been uploaded to the server, and for some reason the form won't be submitted (eg. page refreshed or tab closed), then there won't be a need to save the filenames into the database. How do I remove the files in the server just before a page refresh or tab closing?
1) A good idea to do these kind of things ( at least how I do it ), is that you save all the images immediately ( with filenames ), and when the user closes the page and gets back to it in a while, they all show up again. So something like this:
Let's say you have a table users and a table images. When he uploads images to the server, they will be saved in the server and in the table images even without submitting the form. When the user closes the page, and gets back to it, he will have all the uploaded images again.
2) If you don't want this kind of thing, in the images table you can add a column with the name "draft" or something like that, so when the user uploads pictures, all the images are drafts, and when he submits the form, then they all become un-drafted. So with this, when users close the window, images are still drafted and nobody won't see them.
With this, you can then run a "cronjob" that deletes all the draft images from the server, or you can do that on the user's next login.
Related
There are two forms on a single page, one for sending data and the other for entering pieces when clicking on the product.
That is, when I click on the product, a modal opens and I enter the number there, but I do not want the data in this modal to be sent immediately, I want it to be sent with the product information, how can I do that.
I am using mongodb as database.
I am creating a forum that utilizes the tinymce wysiwyg editor. It seems like the editor's default behavior is to upload an image to the server immediately when a user adds an image to the editor.
What if the user does not want that image anymore? What if a user maliciously adds many, many photos to the server?
I am wanting to submit images to the server only when a user submits a post. That way, I can limit the amount of images downloaded to the server and can better validate the post.
You can set the configuration setting automatic_uploads: false.
With that setting, as long as either images_upload_url or images_upload_handler are specified, images shouldn't be uploaded automatically and should only be uploaded when editor.uploadImages() is called upon form submission.
Here's some more information about automatic_uploads:
https://www.tiny.cloud/docs/configure/file-image-upload/#automatic_uploads
NOTE: Tiny has identified a bug where the automatic_uploads setting isn't always respected when uploading via the image dialog. The bug has been logged, and work to fix the bug is currently being scheduled as of this posting. I will edit this post the fix has been released.
Background
I have a jQuery File Upload widget that is part of a HTML form. The HTML form has a hidden input field that is populated with JSON by the jQuery File Upload widget upon a successful upload. This way, on the server side, I know which uploads to link to the rest of the form information.
When the form is submitted some server side validation takes place. Upon invalid input the page is reloaded and an error message is shown. All the form fields, including the hidden form field with the names and the paths of the uploaded files are still populated.
Problem
My problem now is that after reloading the page, the table with uploaded files is empty. This makes the user believe that the uploads are gone, while in fact, the form still has a reference to the uploaded files in a hidden form field.
Question
Is there a way I can get the jQuery File Upload widget to rebuild the file list upon page load so that users see the files they have uploaded before?
In the meanwhile, I've found the answer to my problem:
I had to manually trigger the done event.
if ($('#hidden-form-field-id').val() != "") {
$('#fileupload').fileupload('option', 'done')
.call($('#fileupload'), $.Event('done'), {
result: {
files: JSON.parse($('#hidden-form-field-id').val())
}
});
}
I am using angular-file-upload
I am taking file input in a dialog, my flow is as follows:
User open dialog, Upload File, User Closes the dialog
The issue is, when the user opens the dialog next time, without refreshing the page (obviously), the previous file name is still there next to "browse" button. But when user click on upload, it doesn't upload the same file, even if the user re select the same file. I know it has something to do with the onchange event but how to solve this in angularjs?
I tried resetting the model attached to file input, but no luck.
Try to set replaceFileInput config to true
I am using ajax modal pop in my asp.net + C# application. My application must show this modal in two situations.
When every thing is ok and the file is read and the data is imported to the database.
When the server side code checks the values that need to be inserted to the database and if they are not correctly formatted, it shows a warning message and a button, so the user would have the option to still insert the erroneous data of the file to the database.
I am using this modal to stop the user from interacting with the controls while the import is being done and it works fine. But for the second scenario I see the modal and when the message and button appear on the screen the modal is still covering the page so the user cannot click on the button or do anything basically. How can I solve this problem?
I thought maybe making the message and button appear on the modal would be an option, but I don't know how to that either. Any suggestions?
/Mono
Heres a tutorial to help you get started wiht the modal itself.
http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/
This is actually a more difficult task then it first appears. Your probably going to want to use ajax, and contact a webmethod to see if there is any errors. Probably make times calls checking for complete, or errors.
File uploads want to do a post back, getting them to do this async is tricky. You may want to research async uploads(or a flash uploader) and see if there are any free uploaders out there. The regular html file uploader control is not asycn.
What you could do is let the page post back, then have javascript run on the page reload, and if it is complete or errors, show the popup.
-Show the modal overlay, while it uploads.
-postback, then run script after postback and on the client page reload show modal success or failed.
I suggest you to change to 3 modal dialogs
Uploading..
Everything went ok
Please fix the following data below:
You will always start with 1.
And then replace it with number 2 or 3, according with what happened at the upload.
If the file upload usually takes usually more than 30 seconds, you may want to consider using a flash upload to provide some feedback to the user at Uploading screen.