Multiple File / Image API upload and API delete (only one, not deleteAll) example

[huseyin]

As a novice user i had my problems understanding how multiple file/image upload works and how to delete only one selected uploaded image and not to delete all.
It is very difficult for a novice user to understand the complicated examples and answers of the very experienced members. 
So i decided to make a very simple example for explaining the multiple file/image upload and selected delete. I am not an expert on Processwire, wanted only to share what i achieved so far. So there may be better ways to do the same. (Take this as an axample form a novice for other novices)

WARNING : As this is only a very simple example; there are no validations and security checks in this example. So please dont use this on a real project without security checks etc.

The attached fileexample.php is complete working example. (I made some last minute comment additions, hope i did not destroyed anything. If you have problems using the example file please inform me, i will check and correct)

With this example you will be able to;
- upload multiple images
- delete only selected images you uploaded before.
Especially for the second part (deleting only one image from a multiple image field) it is very hard to find examples and answers in the forum

HOW TO USE THE EXAMPLE FİLE:

1- Create a TEMP directory for for fileupload below site/assets/
2- Download the attached "fileexample.php file and edit line 24, write the path of the created fileupload temp directory.
3- Upload the "fileexample.php file to site/templates/ folder
4- Create an new field named "images" with type of images.
5- Add a new template. Choose "fileexample" from the recommended list.
6- Edit the "fileexample" template and add the created "images" field from step 4 to it.
7- Create a new Page and select "fileexample" as the template of this page.

Now visit the newly created page and you will see 5 image input fields.
It is possible to use only one inputfield, but it is more visual the way i choose in the example.

The flow of the example is like this;

When you visit the page the form is created.
If there are already uploaded images the thumbnails are shown and a "Delete" button next to it.
If there is no image than a image input is shown. 
As we used "$imageamount = '5';" if there are 2 images already uploaded you will see 2 thumbnail iamges with delete buttons netx to them and 3 image inputfields.

If you choose some images on the image input fileds and hit the "Save" button than the code part starting with
"if ($input->post->fileprocess){"
is triggered.
This part makes the file upload process.

If you click the Delete button next to one thumbnail the script "deleteimage" is trigered. 
This script makes a ajax Post call the same page with the post variable "imagedelete". 
This ajax call sets "imagedelete" variable and so the code satrting with line 
"if ($input->post->imagedelete) {"
Will be trigered.
Here the most important part is the exit in the last line. As this is a Ajax call the call have to be terminated before anything is outputted.

-----------------------------

Hope all is clear understandable. My English not so good, sorry.
If you do not understand any part please ask and will do my best to explain it again.

fileexample.phpFetching info...