O'Reilly logo

Programming Elm by Jeremy Fairbank

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Upload Images with Ports

Currently, the new image upload feature only opens a file prompt. You need to access the selected files to actually upload them. This presents an interesting problem for Elm. Elm is a pure language, so it can’t directly access the DOM to retrieve the selected files.

But, JavaScript easily interacts with the DOM. You just need Elm and JavaScript to talk with each other. They haven’t been on speaking terms up to this point. Maybe JavaScript is a little jealous of Elm. Let’s help them reconcile with ports.

In this section, you will use ports to notify JavaScript that a user has uploaded images from Elm. Then, you will use JavaScript to read the images’ file data and update the note with images.

Notify JavaScript with a Port ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required