Image Input - how to handle remove on server side
We bought the Good Theme some time ago and stumbled across an inconsistency / missing documentation of the image input.
We use the theme together with ASP.NET; so no SPA. We now need to respond to the "Image Remove" on the server side. However, it is not clear from the documentation how this is principally intended from Keen Themes.
Usually you would have a hidden field in the form that is set to true on a remove.
You can also see a hidden field in the documentation - but below Change Avatar:
https://preview.keenthemes.com/html/axel-html-pro/docs/forms/image-input
title="Change avatar">
<i class="ki-duotone ki-pencil fs-6"><span class="path1"></span><span class="path2"></span></i>
<!--begin::Inputs-->
<input type="file" name="avatar" accept=".png, .jpg, .jpeg" />
<input type="hidden" name="avatar_remove" />
<!--end::Inputs-->
</label>We were also unable to see a hidden field in the form during debugging, which may be automatically backed up by the Image Input Component. Believe that this should be the responsibility of the image input.
How did you think your own component here would work for server-side applications?
We can now invent workarounds ourselves, but we wanted to ask first what you plan was.
Could be added to the docs too.
Thanks.
Replies (7)
Oh nice, your forum executes my HTML Snippet instead of as text.
Thats not thaaaat good :-)
For correct code formatting, you can use pre tag. You can find other formatting options by pressing Text formatting options under the text input field.
Yes, but I still can exploit the HTML render code here. OWASP :-)
This issue will be fixed soon.
Hi,
Thank you for reaching out to us.
You can access the documentation for the Good Image Input component here: https://preview.keenthemes.com/html/good/docs/forms/image-input.
In our documentation, you'll notice that the component has various events. These events can be used to send requests to your server.
var imageInputElement = document.querySelector("#image_input_id");
var imageInput = KTImageInput.getInstance(imageInputElement);
imageInput.on("kt.imageinput.change", function() {
// make your request here
});Regards,
Lauris Stepanovs,
Keenthemes Support Team
Thanks for your reply. I found that and thats nice for SPAs. But that's not nice for Server Side Apps with Form Submits.
Then we have to build our own over the events. Too bad.
It would be useful if hidden inputs were set automatically.
Hi,
Thank you for your feedback.
We haven't specifically tested our Image Input component with a different approach, but I guess that if you create a form using Asp.Net form tag helper, you should be able to send the image component input value along with other data within your form.
We will do more testing on this and will include examples in the next Metronic releases.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
