How to use HTML field type in new doctype

[Hardik_Gadesha]

Hello,

What is the function of HTML field type in DocType? can i create a small 3x3 table in HTML and use this in DocType with using HTML field type ?

can anyone guide me to use this HTML field type with example ?

Regards,
Hardik Gadesha
Software Engineer @ AIMDek Technologies Pvt Ltd

[rmehta]

Just create the HTML field and use JS/Jquery to build your UI

[Hardik_Gadesha]

Okay.

If i fill some data in table, where will be the filled data stored ? I want this data in reports link, where all the fields report genrated for particular doctype ?

Thanks & Regards !

[nabinhait]

In frappe, HTML field is just a read-only field, it does not save the data in the database. If you want to save data into the database, you have write your own code for that.

If you just want to create a child table inside a form, you can create another doctype with “Is Table” checked. Then you can add a field with fieldtype “Table” in the parent doctype to embed the newly created child doctype. Check existing doctypes for reference.

[Hardik_Gadesha]

Thanks @rmehta, @nabinhait for your inputs.

We have to build a form (doctype) with custom UI as displayed in attached file. Here user will enter values in 5 fields which we need same as regular fields of other type. We will need the values in reports and other related modules as well, so they must be assigned a name as well, to further reference it.

Now as I couldn’t found documentation for the field type ‘HTML’ and you guys say that it’s only for UI (beautification, etc…), and I don’t want to perform manual database operations from that HTML code.

What options do I have ?
Is any of these options possible :

1. Can I set a background image to a doctype form ? In that case I’ll use an image and will try to place input fields on required places.
2. Can I use field type table by configuring cell level border color/width etc, to achieve the similar look ?
3. Any possibility through nested DocType by creating a DocType with only one input field and use it in another DocType with HTML fields for 5 times to achieve 5 value fields ?
4. can I use name (variables for field value) from that HTML code to refer to other field name [which will be hidden in the doctype] and assign value. And then it will be taken care for database persistence.
5. Any better suggestions ???

We want to try our level best to achieve this in ERPNext so as of now we are not considering any option like ‘It cannot be achieved in ERPNext’

@rmehta, @nabinhait , any highlevel pointers will be very helpful.

Thanks,
Hardik Gadesha

[rmehta]

To update the current document properties, use cur_frm.doc from your custom UI

[Hardik_Gadesha]

Sorry, i can’t get your point @rmehta. Can you please explain me in detail ?

Thanks & Regards,
Hardik Gadesha

[Hardik_Gadesha]

Hello,

Please Guide Me On My Following Queries

1. I created HTML Table using HTML type field in Doctype, But how can i save the data field in this table and display it to report builder ?

2. As i form a a data field which is look like a table, but how can i modify the layout of this UI. i need to group this 12 column field into 3x3 table. I tried to change this layout using inspect element, but could not able to locate the source code of this HTML/CSS file. Please find attached image.

Image - For question second

Image - expected result of above table

Any of the above possible or any other suggestions ?

Thanks & Regards,
Hardik Gadesha

[rmehta]

@Hardik_Gadesha share your code.

[Hardik_Gadesha]

Hello,

@rmehta, Below is my code. I am very new to ERPNext and that coding stuff. So please ignore my mistakes and guide me in proper direction.

i wrote above code in option field in doctype with using HTML type.

Thanks & Regards

[rmehta]

@Hardik_Gadesha I would recommend you go through the developer tutorials before trying to build such an extension.