[BUG]: Attach Control not working in web-form #5

mohsinalimat · 2023-01-30T07:20:19Z

When I assign options {"allowed_file_types": ["image/*"]} in Attach Field Type then I will not work on web-form

in version-13 and version-14 as well.

kid1194 · 2023-01-30T22:37:07Z

@mohsinalimat Thanks a lot buddy for reporting this..

I knew that there is an issue with the web form but I didn't find a way to fix it..

Can you please check the console for any error..
And please also check if only the allowed_file_types option is what makes the control stop working or other options cause that too..

I'm very thankful for your help..

Best regards..

mohsinalimat · 2023-01-31T05:28:59Z

in inspect element html we put accept="image/*" then only images option comes in file browser.

mohsinalimat · 2023-01-31T08:05:37Z

If I change below line in core code then after it works in web-form and doctype form.

I also check in version-13 and version-14.

kid1194 · 2023-01-31T22:17:45Z

@mohsinalimat That's weird..

Anyway, I have updated the plugin, hopefully it will fix this issue..
Please give it a try and let me know if you find any bug..

Best regards..

mohsinalimat · 2023-02-01T04:44:57Z

Still not working in web-from in version-14.

kid1194 · 2023-02-01T22:51:35Z

@mohsinalimat I couldn't find a solution for this problem..

I think that the problem isn't from the plugin, but from the web_script.js file..

Check this #4 for more info..

Best regards..

kid1194 · 2023-02-05T17:08:14Z

@mohsinalimat Hey buddy..

I think that I have found a solution for the web form. Can you please update the plugin, move the config from the Options property to the Better Attach Optiins property and then check if the plugin works properly in desk and in web form..

To show gratitude for your contribution to this plugin, I have added your name in the README file..

Best regards..

mohsinalimat · 2023-02-06T05:35:56Z

Still same error.

mohsinalimat · 2023-02-06T13:37:07Z

@mohsinalimat Hey buddy..

I think that I have found a solution for the web form. Can you please update the plugin, move the config from the Options property to the Better Attach Optiins property and then check if the plugin works properly in desk and in web form..

To show gratitude for your contribution to this plugin, I have added your name in the README file..

Best regards..

Please share a demo video for web-form restrictions.

kid1194 · 2023-02-08T14:30:08Z

@mohsinalimat Sorry buddy, I can't test it currently..

The issue was that in web_script.js, the web form fields of type Attach and Attach Image gets their options property set to null if the property value is not an object and since the plugin options is JSON that means it gets removed..

So, I added a custom field to hold the plugin options in order to bypass this action of web_script.js, and the plugin gets the options from the custom field..

Have you tried it after putting the options in the custom field?

If yes and it still doesn't work, please let me know..

Best regards..

mohsinalimat · 2023-02-08T14:32:14Z

I have child table in web-form. And in child table assign the image property.

kid1194 · 2023-02-08T19:12:16Z

Is there a field property called Better Attach Options?
It should appear under the Options property..

If yes, did you put the plugin options inside it instead of the Options property?

if yes, then did it work for you in web form or not?

kid1194 · 2023-02-13T22:14:29Z

@mohsinalimat Hey buddy..

I just wanted to remind you about the questions I wrote in the above comment..

I'm still waiting for your reply..

Best regards..

mohsinalimat · 2023-02-21T04:23:01Z

Is there a field property called Better Attach Options? It should appear under the Options property..

If yes, did you put the plugin options inside it instead of the Options property?

if yes, then did it work for you in web form or not?

I can not find any Better Attach Options property.

kid1194 · 2023-02-21T21:16:55Z

@mohsinalimat There should be a field for the plugin options..

What version you are using?
Are you using the Beta version?

The field exists in the Beta-8 version...

mohsinalimat · 2023-02-22T04:03:44Z

What version you are using?

version-14 & version-13

Are you using the Beta version?

Yes, Beta-8

mohsinalimat · 2023-02-22T06:13:26Z

Web From

Child Doctype

kid1194 · 2023-02-22T22:20:12Z

@mohsinalimat I believe that you understood me wrong..

The plugin field will only appear if the field type is Attach or Attach Image...

So, when you edit your attach field you will see it and not when editing the child table...

If you edit your WF Attachment Child and you edit the attach field, you will be able to see the plugin options field below the normal options field..

mohsinalimat · 2023-02-23T07:52:15Z

I can not find anything related the plugin options.

kid1194 · 2023-02-23T23:27:55Z

@mohsinalimat The plugin setup code might not have created the custom field..

Can you please do the following..

Go to Home > Customization > Form Customization > Custom Field
In the list, check if there is a custom field called Better Attach Options
If there is no custom field, then create a new field and set the following data:
- Document: DocField
- Label: Better Attach Options
- Field Type: Small Text
- Field Name: better_attach_options
- Depends On: eval:in_list(['Attach', 'Attach Image'], doc.fieldtype)
- Insert Below: options

After creating the custom field, you will be able to see it when editing an Attach or Attach Image field..

If you can't find the document DocField, please let me know..

Best regards..

mohsinalimat · 2023-02-24T04:49:08Z

When I add Better Attach Options in Core Doctype of DocField then I will show. Issue is not solved in web form.

kid1194 · 2023-02-25T00:22:11Z

It should be working..

Anyway, I have made a small change to the plugin..

Please update and then when you open the web form, open the browser console and you will see the current options of the plugin. Check if the options from the console matches the options from the Better Attach Options field..

Also you will find in the console the uploader options that is being used when you click on the attach button and the file browser options when you click on the file browser button..

All the 3 options that you will find in the console should match with the options from the Better Attach Options field..

Thanks a lot buddy for your help..

mohsinalimat · 2023-02-25T05:08:10Z

		frappe._messages = {
 "Sr": "Sr"
};
		frappe.web_form_doc = {
 "allow_comments": 0,
 "allow_delete": 0,
 "allow_edit": 0,
 "allow_incomplete": 0,
 "allow_multiple": 0,
 "allow_print": 0,
 "apply_document_permissions": 0,
 "button_label": "Save",
 "creation": "2023-02-22 11:28:13.181937",
 "doc_type": "WF Attachment",
 "docstatus": 0,
 "doctype": "Web Form",
 "idx": 0,
 "in_edit_mode": false,
 "in_view_mode": false,
 "is_new": true,
 "is_standard": 0,
 "list_columns": [],
 "login_required": 0,
 "max_attachment_size": 0,
 "modified": "2023-02-22 11:28:15.646272",
 "modified_by": "Administrator",
 "module": "Website",
 "name": "wf-attachment",
 "owner": "Administrator",
 "published": 1,
 "route": "wf-attachment",
 "show_attachments": 0,
 "show_list": 0,
 "show_sidebar": 0,
 "title": "WF Attachment",
 "web_form_fields": [
  {
   "allow_read_on_all_link_options": 0,
   "creation": "2023-02-22 11:28:13.181937",
   "docstatus": 0,
   "doctype": "Web Form Field",
   "fieldname": "name1",
   "fieldtype": "Data",
   "hidden": 0,
   "idx": 1,
   "label": "Name",
   "max_length": 0,
   "max_value": 0,
   "modified": "2023-02-22 11:28:15.646272",
   "modified_by": "Administrator",
   "name": "192ee1f888",
   "owner": "Administrator",
   "parent": "WF Attachment",
   "parentfield": "web_form_fields",
   "parenttype": "Web Form",
   "read_only": 0,
   "reqd": 0,
   "show_in_filter": 0
  },
  {
   "allow_read_on_all_link_options": 0,
   "creation": "2023-02-22 11:28:13.181937",
   "docstatus": 0,
   "doctype": "Web Form Field",
   "fieldname": "wf_attachment_child",
   "fields": [
    {
     "fieldname": "name",
     "fieldtype": "Data",
     "label": "Name"
    },
    {
     "allow_bulk_edit": 0,
     "allow_in_quick_entry": 0,
     "allow_on_submit": 0,
     "better_attach_options": "{\"allowed_file_types\": [\"image/*\"]}",
     "bold": 0,
     "collapsible": 0,
     "collapsible_depends_on": null,
     "columns": 0,
     "creation": "2023-02-22 11:26:43.193107",
     "default": null,
     "depends_on": null,
     "description": null,
     "docstatus": 0,
     "doctype": "DocField",
     "documentation_url": null,
     "fetch_from": null,
     "fetch_if_empty": 0,
     "fieldname": "attach",
     "fieldtype": "Attach",
     "hidden": 0,
     "hide_border": 0,
     "hide_days": 0,
     "hide_seconds": 0,
     "idx": 1,
     "ignore_user_permissions": 0,
     "ignore_xss_filter": 0,
     "in_filter": 0,
     "in_global_search": 0,
     "in_list_view": 1,
     "in_preview": 0,
     "in_standard_filter": 0,
     "is_virtual": 0,
     "label": "Attach",
     "length": 0,
     "mandatory_depends_on": null,
     "max_height": null,
     "modified": "2023-02-24 13:15:05.238014",
     "modified_by": "Administrator",
     "name": "44e44f08b8",
     "no_copy": 0,
     "non_negative": 0,
     "oldfieldname": null,
     "oldfieldtype": null,
     "options": "{\"allowed_file_types\": [\"image/*\"]}",
     "owner": "Administrator",
     "parent": "WF Attachment Child",
     "parentfield": "fields",
     "parenttype": "DocType",
     "permlevel": 0,
     "precision": null,
     "print_hide": 0,
     "print_hide_if_no_value": 0,
     "print_width": null,
     "read_only": 0,
     "read_only_depends_on": null,
     "remember_last_selected_value": 0,
     "report_hide": 0,
     "reqd": 0,
     "search_index": 0,
     "set_only_once": 0,
     "show_dashboard": 0,
     "show_preview_popup": 0,
     "translatable": 0,
     "trigger": null,
     "unique": 0,
     "width": null
    }
   ],
   "fieldtype": "Table",
   "hidden": 0,
   "idx": 2,
   "label": "WF Attachment Child",
   "max_length": 0,
   "max_value": 0,
   "modified": "2023-02-22 11:28:15.646272",
   "modified_by": "Administrator",
   "name": "fb7fd3d135",
   "options": "WF Attachment Child",
   "owner": "Administrator",
   "parent": "WF Attachment",
   "parentfield": "web_form_fields",
   "parenttype": "Web Form",
   "read_only": 0,
   "reqd": 0,
   "show_in_filter": 0
  }
 ]
};

Update the custom app but still same issue.

kid1194 · 2023-02-25T20:44:08Z

@mohsinalimat Can you please post a screenshot of the web browser console when using the web form..

mohsinalimat · 2023-02-27T05:16:00Z

Browser Console log of web form.

kid1194 · 2023-02-28T00:19:14Z

@mohsinalimat I realized that the plugin doesn't override the default attach controls in web forms since it doesn't get loaded at all..

Injecting custom JavaScript and CSS files to web forms cannot be done unless specified in the hooks and for specific standard web forms only..

Because of that, I have made the plugin intercept the web form load and manually inject both JavaScript and CSS but I'm not sure that it will work since I don't know when the code will be executed, at the beginning of the web form load or at the end (which is the right time)..

So please update the plugin and check if it works automatically in web forms or not..

If it doesn't work, then the please try the following..

If the web form is set as Standard, then the following code must be placed at the top of the exported web form js file..
But if it is not set as Standard, then the desired web form must modified and following code must be placed at top inside the Client Script field of the web form..

For v14

frappe.require(['better_attach.bundle.js', 'better_attach.bundle.css']);

For v13

frappe.require([
    '/assets/frappe_better_attach_control/js/better_attach.js',
    '/assets/frappe_better_attach_control/css/better_attach.css',
]);

For v12

frappe.require([
    '/assets/frappe_better_attach_control/js/better_attach_v12.js',
    '/assets/frappe_better_attach_control/css/better_attach.css',
]);

mohsinalimat · 2023-02-28T12:33:26Z

Still facing same issue.

kid1194 · 2023-02-28T15:44:51Z

@mohsinalimat Did you update the plugin?

If you did then please check frappe error log doctype and see if there is an entry from the plugin..

Have you tried the second method which is adding the js code?

kid1194 · 2023-03-13T13:27:30Z

@mohsinalimat Thanks a lot buddy for your help..

Just to clarify things, you have an attach field in a child table and because of the attach field, you can't edit a row or add a new one in that child table. Am I right?

What about if the attach field is not in a child table, does it work or not?

mohsinalimat · 2023-03-13T13:44:56Z

What about if the attach field is not in a child table, does it work or not?

Not checked.

mohsinalimat · 2023-03-13T13:45:51Z

Yes. And it's sometimes this happened.

kid1194 · 2023-03-13T14:09:28Z

@mohsinalimat I suspect that it is because of the dialog that is supposed to display the file when the filename is clicked..

Is the field type Attach or Attach Image?

Attach Image field doesn't have a dialog so can you please try the child table with Attach Image field..

And can you please try both Attach and Attach Image fields outside child table..

v2 will be dedicated to you bro for your enormous help 😁

mohsinalimat · 2023-03-13T14:21:32Z

It's Attach field type.

kid1194 · 2023-03-13T20:26:08Z

@mohsinalimat I have changed a bit for v14 desk and web form controls in terms of the filename click.

I have put some console logs for the click event and removed the previous logs..

So please update and check the console after you click on the attached filename, edit button and add row button..

If you find any log in the console, please post a screenshot..

Best regards..

mohsinalimat · 2023-03-14T04:59:11Z

In web form working perfect now.
Still Edit button not in form view, Please check below video.

ScreenRecorderProject1.mp4

kid1194 · 2023-03-14T15:55:26Z

@mohsinalimat I have updated the plugin..

I have disabled the uploaded files list and preview dialog that appears after clicking the file name, only if the field is placed inside a child table..

I'm trying to find out if the problem is from the dialog or not..

There should be a console log stating that the field is inside a child table but if it doesn't appear in console it means that the child table check code isn't working..

Please give it a try and then let me know if it is still working in web form and if the bug is fixed in desk..

Best regards..

kid1194 · 2023-03-17T20:59:12Z

@mohsinalimat Hey buddy..

I just wanted to check if you have tried the last update or not.

Best regards..

mohsinalimat · 2023-03-18T02:30:31Z

I think all is good. And in form edit view there is bug in frappe framework.

kid1194 · 2023-03-19T14:32:07Z

@mohsinalimat Thanks a lot bro..

So the problem was with the dialog of uploaded files..

I will create a custom dialog that is not bound to frappe dialogs, then I will update the plugin and let you know..

Can you please tell me about the frappe bug you found so I can check if I can help them fixing it..

Best regards..

mohsinalimat · 2023-03-19T15:04:24Z

In Attach field type in child table issue.

kid1194 · 2023-03-19T17:47:47Z

@mohsinalimat I have updated the plugin with custom dialog for uploaded files..

Please give it a try..

In Attach field type in child table issue.

You mean the edit dialog is still not opening?
Or it is something else?

kid1194 · 2023-03-23T22:57:24Z

@mohsinalimat Bro, I just want to remind you about trying out the latest update..

Have you tried it?

In Attach field type in child table issue.

You mean the edit dialog is still not opening?
Or it is something else?

mohsinalimat · 2023-03-24T00:29:35Z

You mean the edit dialog is still not opening?
Or it is something else?

Yes. Not opening

kid1194 · 2023-03-24T02:52:19Z

@mohsinalimat Is the edit dialog not opening using the latest update? If yes, then I need to create a different way to display the list of uploaded files in child table..

Thanks a lot bro..

mohsinalimat · 2023-03-24T03:25:00Z

Yes, not opening in form view in child table.

kid1194 · 2023-03-27T21:21:31Z

@mohsinalimat Brother, I have updated the plugin..

Now the child table dialog should open and everything should work..

Please give it a try and let me know if you find any bug or problem..

Please also try it with multiple files disabled, using Attach Image and also when editing an entry with already uploaded files, only if you have time..

Best regards..

kid1194 · 2023-04-03T16:46:46Z

@mohsinalimat I just want to check if everything is working or there are any issues..

Best regards..

mohsinalimat · 2023-04-03T17:03:27Z

Still not opening in form view in child table.

kid1194 · 2023-04-03T21:07:02Z

That's weird bro. I have made the dialog gets created on demand and gets destroyed when closed so it doesn't block the child table dialog. Just like dialog of frappe File Uploader..

Do you think that I should get rid of the dialog and find another way to list and preview the uploaded files?

Should I do that for child table only or for form also?

Thanks a lot for your help bro..

Best regards..

kid1194 · 2023-04-06T22:32:29Z

@mohsinalimat Hey bro..

I have removed the dialog from the plugin and replaced it with a list that is displayed under the field..

I have removed the dialog from desk and web form..

So please whenever you are free, update the plugin and give it a try..

I hope that there will be no bugs this time..

Best regards..

kid1194 · 2023-05-19T22:04:47Z

@mohsinalimat Hey bro..

I just want to check if everything is working well or there are still some bugs..

Best regards..

NirajRegmi · 2024-04-17T08:48:21Z

{"allowed_file_types": ["image/*"]}

I have update the plugin but still I am facing the issue.

NirajRegmi · 2024-04-17T08:50:02Z

Please find here the screenshot. I have added the field but its not working doctype also. I am able to attach .xls file also.

NirajRegmi · 2024-04-17T08:51:36Z

also in frappe standard webform i am not able to attach files. it is throwing exception 404 error

NirajRegmi · 2024-04-17T08:52:23Z

@kid1194 please help me with this.

kid1194 · 2024-05-02T19:13:19Z

@NirajRegmi Hey bro..

First, I would like to thank you for reporting problems and for your patience..

I have made a lot of changes hoping that it will work without any problem..

The custom field is no longer needed since the app now has a registered hook for website context where it checks if the page displayed is a web form or not..

For web forms, the app will get all the attach field options, build the js library if not already built and inject the field options to js..
If the web form doesn't have any attach field, then all this process will be skipped..

So please give it another try and let me know if you face any problem..

A million thanks to you bro, and I hope that putting a badge with your name on it in the README file will show some of my appreciation for you..

Best regards..

mohsinalimat added the bug Something isn't working label Jan 30, 2023

mohsinalimat assigned kid1194 Jan 30, 2023

kid1194 added the unknown status label May 29, 2024

kid1194 closed this as completed May 29, 2024

[BUG]: Attach Control not working in web-form #5

[BUG]: Attach Control not working in web-form #5

Comments

mohsinalimat commented Jan 30, 2023 • edited

kid1194 commented Jan 30, 2023

mohsinalimat commented Jan 31, 2023

mohsinalimat commented Jan 31, 2023 • edited

kid1194 commented Jan 31, 2023

mohsinalimat commented Feb 1, 2023

kid1194 commented Feb 1, 2023

kid1194 commented Feb 5, 2023

mohsinalimat commented Feb 6, 2023

mohsinalimat commented Feb 6, 2023

kid1194 commented Feb 8, 2023

mohsinalimat commented Feb 8, 2023

kid1194 commented Feb 8, 2023 • edited

kid1194 commented Feb 13, 2023

mohsinalimat commented Feb 21, 2023

kid1194 commented Feb 21, 2023

mohsinalimat commented Feb 22, 2023 • edited

mohsinalimat commented Feb 22, 2023 • edited

kid1194 commented Feb 22, 2023 • edited

mohsinalimat commented Feb 23, 2023

kid1194 commented Feb 23, 2023 • edited

mohsinalimat commented Feb 24, 2023

kid1194 commented Feb 25, 2023

mohsinalimat commented Feb 25, 2023

kid1194 commented Feb 25, 2023

mohsinalimat commented Feb 27, 2023

kid1194 commented Feb 28, 2023

mohsinalimat commented Feb 28, 2023

kid1194 commented Feb 28, 2023

kid1194 commented Mar 13, 2023 • edited

mohsinalimat commented Mar 13, 2023

mohsinalimat commented Mar 13, 2023

kid1194 commented Mar 13, 2023

mohsinalimat commented Mar 13, 2023

kid1194 commented Mar 13, 2023

mohsinalimat commented Mar 14, 2023

kid1194 commented Mar 14, 2023

kid1194 commented Mar 17, 2023

mohsinalimat commented Mar 18, 2023

kid1194 commented Mar 19, 2023

mohsinalimat commented Mar 19, 2023

kid1194 commented Mar 19, 2023 • edited

kid1194 commented Mar 23, 2023

mohsinalimat commented Mar 24, 2023

kid1194 commented Mar 24, 2023

mohsinalimat commented Mar 24, 2023

kid1194 commented Mar 27, 2023 • edited

kid1194 commented Apr 3, 2023

mohsinalimat commented Apr 3, 2023

kid1194 commented Apr 3, 2023

kid1194 commented Apr 6, 2023

kid1194 commented May 19, 2023

NirajRegmi commented Apr 17, 2024

NirajRegmi commented Apr 17, 2024

NirajRegmi commented Apr 17, 2024

NirajRegmi commented Apr 17, 2024

kid1194 commented May 2, 2024

mohsinalimat commented Jan 30, 2023 •

edited

mohsinalimat commented Jan 31, 2023 •

edited

kid1194 commented Feb 8, 2023 •

edited

mohsinalimat commented Feb 22, 2023 •

edited

mohsinalimat commented Feb 22, 2023 •

edited

kid1194 commented Feb 22, 2023 •

edited

kid1194 commented Feb 23, 2023 •

edited

kid1194 commented Mar 13, 2023 •

edited

kid1194 commented Mar 19, 2023 •

edited

kid1194 commented Mar 27, 2023 •

edited