Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Michael Vervloet
Michael Vervloet
5,802 Points

Multi File Upload MeanJS

Hi, this might be quite a complex question but I have always been struggling with this problem since I started with programming.

I have a MeanJS project set up on my computer, generated a crud module with MeanJS generator, added some custom fields, all works fine, but since I'm creating a real estate app I need to be able to add multiple images to every listing.

so I have a ''' input type="file" name="images[]" id="images" multiple '''' field in my create view.

  1. I want to preview the images on the page so I guess I'd have to do something like $("#images").on(("change", function(){ // Add the images to a #imagePreview div }); but don't know how to do the rest to preview them

  2. I only want to upload the files once the full form is submitted, so I would probably have to change the create() function that comes with the CRUD module.

  3. process the images server side:

  4. store them in a folder on the server (maybe renaming them as well)

  5. add the URL's in some way to the database with the rest of the info of the project

(Maybe an idea for a course?)