[Resolved] Understanding image upload

[Author]

Posts

[FelipeP5703]

Tell us what you are trying to do?

I'm trying to understand how images are handled. I'm using a form that gives the user the ability to upload an image to the custom field image. I am NOT using WordPress Media Library (it's checked off on the form).

Thus when the user clicks to upload the image, it opens a select box where he can choose the image from his computer or mobile. After he selects the image, what happens?

Is there a hook for images?

Before he submits the form, is there a way to use a custom function in other to crop the images (no I'm not talking about Toolset's cropping feature). I'm asking if there is a way to manipulate the image before it gets saved.

For example, when the user clicks to upload the image, he selects the image, then a box would open up for him to be able to crop it, zoom it (yes this part would be custom coding, but I need to understand how to do it).

I hired a programmer but he can't seem to "get the picture once the user selects the image." So I kind of need to explain to him what Toolset hooks or function can be used to accomplish this feature.

So you can understand what I want, I made a video here: hidden link

Thank you

[Christian Cox]

After he selects the image, what happens?
Without the Media Library active for this Form, nothing is triggered until the Form is submitted. Since we updated Forms to support the native Media Library upload system, the old AJAX uploader was removed. Prior to implementing the Media Library, there was an option to upload images with AJAX before form submission, and an event hook you could use to validate those images. Now, there is no special event fired when this image uploaded and before the Form is submitted, unfortunately.

I hired a programmer but he can't seem to "get the picture once the user selects the image."
Right, without the Media Library active there is no pre-upload hook available, and the image file doesn't yet exist on the server so no server-side processing is possible. You could use the cred_form_validate hook to perform validation during submission, like testing the height and width of the image, and return errors if necessary to the front-end form. If the validation fails, the submission is not processed and the Form page reloads. If the validation passes, the submission is processed and the next steps depend on what settings you choose in the Form editor.

Another option would be to allow the Form submission to happen as normal, and if successful, redirect the User to another page where that uploaded image has been loaded into some kind of photo manipulation widget created by your developers. We offer a redirection API you can use to modify the redirection URL or add parameters, etc. So after the Form is submitted maybe you redirect the User to yoursite.com/edit-your-image/?post_id=12345. Then on that page the developers can access the post ID from the URL to access any custom field value, including the image field. Here are the links to those APIs:
https://toolset.com/documentation/programmer-reference/cred-api/#cred_form_validate
https://toolset.com/documentation/programmer-reference/cred-api/#cred_success_redirect
Note that for the success API to work, you must choose some kind of redirect in the Form editor settings. It doesn't matter which page or post you choose, but something must be chosen.

[FelipeP5703]

Christian,

Thank you for clarifying it. Now let's say we decide to use WordPress Media Library. What would that scenario look like?

[Christian Cox]

During the Media Library process, native WordPress Media Library events are available as per the WordPress API. Those fall outside the scope of support we offer here, since they are not specific to Toolset functionality. After the Media Library process is finished, Form submission events are still available in the Forms API.

[FelipeP5703]

Thanks for the clarification Christian. My issue is resolved now. Thank you!