frappe-better-attach-control

frappe-better-attach-control copied to clipboard

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.

@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..

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

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.

@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..

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

@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..

@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..

Still same error.

@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.

@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..

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

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?

@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..

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.

@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...

What version you are using?

version-14 & version-13

Are you using the Beta version?

Yes, Beta-8

Web From

Child Doctype

@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..

I can not find anything related the plugin options.

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

Can you please do the following..

1. Go to Home > Customization > Form Customization > Custom Field
2. In the list, check if there is a custom field called Better Attach Options
3. 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..

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

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..

		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.

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

Browser Console log of web form.

@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',
]);

Still facing same issue.

@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?

I have update the app and uninstall and install again.

Second option is also tried but no luck.

@mohsinalimat Did you check frappe error log doctype for any error entry posted by the plugin?

If you checked and there were no plugin errors then making the plugin work for web forms might not be possible..😔

I have checked frappe source code for any possible workaround but I couldn't find any other than what I mentioned in the comment before last..

The context injection hook seems to be executed before the web form which is why the injection code doesn't work..

Even if I inject the js and css files for every web page and form, web forms will override both js and css if the form is set as Standard..