[Resolved] Edit Post not accepting image file type

[Author]

Posts

[puneetS-3]

I have a post edit(woocommerce product) form, which has two image field. When I open the edit form, I can see the image being loaded in the form. I have attached a image for the form. Now, When I submit the form, it says that the two fields are compulsory, indeed they are compulsory but they are there too.
I have attached an image, for that too. I am able to add the images for this post but I am unable to make image file indentified when, it is there.
Doing this in Mozilla I got this console error :
Don't know if it is relevant or not.

Request to access cookie or storage on "<URL>" was blocked because it came from a tracker and content blocking is enabled. 4
Request to access cookie or storage on "<em><u>hidden link</u></em> was blocked because it came from a tracker and content blocking is enabled.
edit-school
Request to access cookie or storage on "<em><u>hidden link</u></em> was blocked because it came from a tracker and content blocking is enabled.
2 edit-school
Request to access cookie or storage on "<em><u>hidden link</u></em> was blocked because it came from a tracker and content blocking is enabled.
edit-school:47:4798
Request to access cookie or storage on "<em><u>hidden link</u></em> was blocked because it came from a tracker and content blocking is enabled.

I have attached the screenshot of my edit form : hidden link

[Christian Cox]

Hello, can you try these troubleshooting steps first?
- Temporarily disable all custom code in Toolset > Settings > Custom Code
- Temporarily disable all plugins except Types, Views, Forms, and WooCommerce
- Temporarily activate a default theme like Twenty Nineteen
- Test again. If the problem is resolved, reactivate your theme, plugins and custom code one by one until the problem returns.
- If the problem is not resolved, I'll take a closer look.

[puneetS-3]

Hey Christian,

I did all the steps that you have mentioned, the problem still persists.

I have activated all the plugins again.

[puneetS-3]

Hey waiting for the reply.

[Christian Cox]

Hi, thanks for testing. If the problem persists, I will need to create a clone of your site so I can run some additional tests locally without effecting your live site. If you approve, I will use the Duplicator plugin to create this site clone. Please provide an admin login in the private reply fields here and I will get started.

[Christian Cox]

Okay I was able to see the problem in my local copy of the site. As a test, I disabled the custom JavaScript in the Form editor and set the Forms submit button to be visible. When I did this, the Form submitted successfully without any errors. So it seems something in your custom code is triggering this issue. I think it has something to do with the error shown in the console:

TypeError: null is not an object (evaluating 'document.getElementById('submit-button').onclick = function() {
   document.getElementsByClassName('main-toolset-button').click();
}')

I think all your custom JS code should be inside the jQuery document ready callback. I think the custom submit button isn't ready when your onclick handler is initialized, so the .main-toolset-button click event is not triggered correctly.

[puneetS-3]

Hey Christian, I have also figured out that when I click on the orignal submit icon, rather than, the one which I have used as mask it works. I have fixed the above error which was printing in the console log now. Still I am unable to make it work using the masked button.

I have used this type of fix in one more form and things are working fine there :

Its in the parent login section :
A test parent user is -
U : bhanu101
P : abcd

I need to use the masked section because I am unable to move the submit button after the next button when it reaches the final stage of the multi-step form.

How can I fix this bug now ?

[puneetS-3]

Hey Christian, I was able to make it work. Thanks for your help. ☺️