Need help for assignment

I have been working on a web application which I have to save a product information. I uses Cloudinary as my photo upload etc.

The workflow goes like this:
Information saves into session -> Information saves into database from the session when method to upload photo is triggered -> photo information is stored into database

However, I keep encountering problems when I attempt to save the information into session. I have tested out that the information is able to be saved into the database standalone, however I don't know how to make the necessary adjustments to make the photo upload. Please help me out ASAP, thanks in advance.

EDIT: I managed to solve it and managed to save the information into the database. However I still need to store other information.

This a selection menu that is database driven. As such option value 1 or 2 will be represented when database is set.

The problem I face now is that the var collectedBrandName is taking in the value of the option value, instead of recording it as per the selected brand name, it records the number. I don't know how to make it record the brand name in the javascript.

Revised project:

EDIT2: I managed to fix the problem stated before. I'm left with parsing in a value and 2 presentation issue.

As of right now, I can parse Product Name, Product Image and Product Price (off the picture) into the session and database. The description's value seems to keep returning null and strangely enough can be parsed into the database.

Javascript codes for the page:

Problem 2: I don't know how to display the picture stored in Cloudinary! (RESOLVED)
I have decided to improvise and implemented a table, successfully handled that issue!

Problem 3: I can't update the photo in Cloudinary

Revised project as of 19/8/2016 8:11PM (GMT +8):

NOTE: I need to submit this at 11:30PM (GMT +8) 19 Aug 2016

Well, I don't think you need to store whole images in the database, it slows your app down. An alternative would be to locally save images and save a string which is the image name into the database. Thats how I do it in my projects and in HTML just get the image name and set it dynamically.

I will take a look later when Im back from work, but just an idea to think about.

Eh I don't store the images in the database, only the information such as height and width etc are stored while the picture itself is stored into the Cloudinary. You'll understand once you see it for yourself.

I managed to resolve one of the problems, 2 left!

Im no jedi master at Javascripting, and all that jazz, but is your productDescritption value is a string?, seems like you imported some 3rd party API into your project(i may be wrong, but it seems so with all the fonts and font size editing and what not available), and sometime they can result in absolutely wierd results, so read through the documentation, or try a console.write("")(Atleast i think thats what it is called in html5, else try googlefu) and see if you can get it as a string value. Again im not a master at java scripting but in regular java you can use instanceof to check and have a bool returned you can print, it may even be as simple as you can use a .toString(), or a dirty cast like someValue+"" to get your wanted string result. and before you even check make sure the database cannot have that value as a null value(null is never a good value to use, its allways "", or 0, or 0.0 or something like it. null is just a fancy way of saying nothing, And that can give some horrible experiences when you do unit testing, and so on), it would also help you a whole lot when debugging.