Hello, in this video I will show you how you can upload an image file into database and how you can display it in EDF application as a below. So, first thing I will go to the database then I will add a new column in St. Louis to stores in gluey image. So, I will go to the employees right click it and I will add here a new column call when we image and the type of St. Louis image will be below we will restore Zimbabwe image the database and we will display it on the ADF application. And let us now create a new application ADF application below in ADF replicant application Nick just because cuz I would carry it business object I will select employees employees to finish Okay, so let's have a look in same believe you that's reviewed you will find the image here as epi lope domain okay.

So let us now create beach which I want to display an employee table and I should upload the image to the employee table and this image should be spool the database and you can be able to place the employee image in the ADF skinny so I would carry now an empty page Okay and this right bending splitter will be and the left hand side will be the employee table and right hand side we can add the displays in blue image. So are you in the first one here, I will add a collection to add a table and here I will add an image icon, which should read the image from the database. This is a two day exam between table drinking and believe you as a table Okay Okay, so see for now I need an option to select a bill we he said I need to upload an image on this symbol UI.

So what I will use let us add to your secondary toolbar. And in this country toolbar, I will add toolbar as a PDF component which is responsible for uploading the image is in both files so I would add here in your component code in both file EML file component is responsible for uploading file into a nation If application is to upload file information you have to use input file combined. So, we can right here the thickest will be shoes m image or we can say after this component in the behavior, you will find huge value changes fellow change listener, you will edit this and kureta been Molly been Molly been viewed been okay and I will create a method called upload M image. So, here we just double check it is here It might be uploaded in the chick that expression is existing value change listener and I will set an auto submit equal to true.

This is the first step. So, first step you should add in both file component and Set Root submit through and edit value change listener also back up. So, let us back to the backbeat here. And you can start writing your code to upload the file to disk Receive the file once user uploaded you can right Upload file. File, equal Upload file and the file will come from a value change event object. Value change event dot get a new value.

Let us import Upload File okay to the badge my face turns out what Yes. This is the first step to get the foil. Xin we should get citrate off and sits and says foil into the iterator. So to get to say traitor, you should first Good binding. So, I add the shortcut to write the binding line. So it will be bind to container using bind expand liquid tickets will get the current get current binding entry.

Let us import the point container and the binding thickest okay then I need to get a traitor so I will write DC a traitor pain Dink later tour equal bindings to get and it gives a three tour. So I will go to the big definition and you will get a treat or need Okay, and it does import this UI traitor binding and it should cause to DCI traitor by altos that we will get the current row, which is user should select to either get your current pro don't sit sit attribute and we need to set this attribute image with this But actually you can try it like this, it will give you an exception because image is using it below domain. So, you should say the below domain. So, we should write a function which will return below the domain which actually will receive this file and we will return the blob the domain file, this is the function which will receives the input file input stream and return the below So, it was first imported below Okay, so, here this function should be added here and it will receive in whoops three so, you will find here file dot get it in which three.

So, as I told you you can sit in file as an object to the employee image. Why because this similar image is a type of below bit domain. So we need to receive a file input stream and return a below B domain. So this function will do that it will receive an input stream after that we'll create a new pillow domain and from this pillow to mean it will get an output stream and right image stream to the stream this just makes some imports okay so we on boarded or library So, our code is really all just to you need is to surround this because this is throw exception you can surround this code by try and catch. So, you will write try catch and you will just add this code inside try catch no this is how you can upload an image so, you add the input file component in the value change listener by the to the back been then you will receive the value change it and get the file after you get the file gets a binding I traitor and sits attribute with this file input stream but you can't insert file input stream to the traitors attribute straightaway you have to convert this file input stream to a b loop domain.

So I will create functions called new block the mean for input stream it will receive input stream and return below the mean from the input stream I will create output stream from the below domain and I will write able to stream to the obvious stream like this. After that what we can do we just need to make a commit to commit changes. So, I will write here operation binding be equal buying things don't get it operation binding is import operation winding after that, get it operation binding and we should give the name commit to that will be execute good deliberation finding and take the string of commit exists and operation to execute. So, you have to add commit operation in the binding otherwise you will get null pointer exception. So, I will go to the binding and I will add a commit operation. So, this is how you can move the file into The database SAP loop.

So let us now run and the chick this upload Okay, so this is Emily. So let's first increase the width of this table. So let us go to the splitter and split position we can make it maybe 100 or maybe 50 okay and it's so fresh. Okay, so this is a employee table. This is the input file to upload the image. So this is like in between maybe 100.

And this is Choose File. I don't need some random image from For alternate, so we can pick this one and the bristle. So, now it will load it is now uploaded and you will find it is stored here if you open the database data with a C 100 you will find here below it means there is a data here. So, this is how you can do it our upload and build image into database. We can take 110 beat shoes file we take the second one okay and Okay. So now what is uploading a file and it is here actually should hide this column But I just want to split it to see that it is uploaded.

Because the video I will show you how you can select disassembly and you see the movie image in the right hand side. So see you in activity