How to add totally customized code for the doctype

ERPNext
1

Hello All;

For example, if I need to add something special in the doctype, like new table (not same current existed table in erpnext) with totally new code, colors and actions, something can not be done using the current allowed fields. How to do this?

Regards
Bilal

2

You can use a Custom Field to create a new table. Check this link for more info:
You can look into here : Custom Field

To add custom code, you can use a Client Script or a Server Script:
https://docs.frappe.io/framework/user/en/desk/scripting/client-script
https://docs.frappe.io/framework/user/en/desk/scripting/server-script

3

No, I do not mean like this.
How I can create a table using html and javascript? I need to build the table with special features, shape and color … I do not need to have table like the table that are used in the doctype.

Regards
Bilal

4

Hi @bghayad:

Add an HTML field on your doctype. With client script (or .js file) “inject” content to the field with something like that:

html = '<table>
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
</table>'

frm.fields_dict.your_html_field.html(html);

Check this for reference.

Hope this helps.

1 Like
5

Thank you. That is good.
Now my question is: by adding custom html and script, and by having fields directly in this html, so when doing save or load or duplicate, how I will guarantee that these fields will be saved or loaded or duplicated specially that these fields are not added in the doctype fields, but it is part of the html and javascript directly.

Do I need to go through the save, load and duplicate and include these parameters that are used in the html and js?

Because if I am going to add these fields in the doctype definition, it will be related to another fields that are existed in another location while actually I am aiming another fields that are existed in the html and js code.

How I can manage this?
Regards
Bilal

Regards
Bilal

6

Hi @bghayad:

Trying to replicate all the frontend framework funcionality from the scratch will be not so easy … Maybe you can use regular table and play with JS, jQuery and CSS from doctype .js file or client script, to get your desired design? This way you will preserve all the funcionality.

Hope this helps.

7

I understand this.
But, how do you see the ability to go to the save, load and duplicate and do the needed modification to include these parameters (fields) that are going to be added in the javascript and html? How do you see this? Is it achievable and practical or not?

Regards
Bilal

8

Hi @bghayad:

Despite I didn’t found yet nothing unachievable, this kind of customizations use to be unpractical by the end. If you need really deeply custom frontend, for many Doctypes … maybe you can build this frontend separately, using Vue and Frappe-UI, like Frappe CRM, Insights, LMS and many other apps.

Sometimes is hard to choose the right way. Think about further updates, maintaining, etc … I learnt a lot of “things not to do”. IMHO, yours would probably would be one of them :wink:

2 Likes