Customization of Form to Grid Table


The goal of this customization is to save time in data entry. Normal software used tabular form to enter the items and its related details and you can jump to next field by pressing Tab or Enter keys. The case in ERPNEXT is you have to add line and then pop-up window screen will come up then you enter the item and the details then you submit the item and the line will be added, you have to repeat the same to add another item. This way is time consuming specially for an invoice
,for example, with so many items that may exceed 30 lines and rate is not always fixed.

In other ERP , they use tabular form and you can enter the item and its details very easily and smoothly like in normal software, also the next line will be added automatically by pressing Tab or Enter keys.The change is applicable to all forms related to Purchase/Sales cycles.!376&authkey=!ACBstu6epFAmy5c&v=3&ithint=photo%2Cpng

I am planing to use jqwidgets grid:

Could you guide my how to implement it?


1 Like

@Mohammed_Redha this is a hard problem.

  1. jqgrid is not free
  2. Existing custom scripts should not break.

The best way to do this is to extend the existing grid so that you can show inputs on the collapsed row and also have the extended form “hidden”. Every entry into the collapsed row should have a back-to-back entry to the hidden form and should also be refreshed. If you are pushing your code to GH, we can help.

Spreadsheets are there since Supercalc early 1980’s without fundamental design changes, which shows that grids with copy/paste/select columns etc functionality are one of the most efficient data entry formats. Editable grids would defenitely improve the usuability
rgds robert



Thanks for your reply,what about this library:

It has GPL Edition.

If there is some way to extend the existing grid why not!
Could you help me on how to implement it?

and i willing to push it to github definitely :blush:


Like I said, its easier to add input elements on the existing grid.

Here is a starting point: frappe/grid.js at develop · frappe/frappe · GitHub

Dear rmehta,

I read the tutorial and i don’t find clue how to extend existing grid.
How i can figure the way of changing or extending the grid.
Could you provide some example if it is available.


@Mohammed_Redha this is not a standard configuration option, you will have to do some javascript hacking to first understand how the current grid works and then how can you extend it. If you make progress or have specific questions, would love to help you, but I am not sure what is the best way to build this either.

@Mohammed_Redha any progress on this issue ?