function on_view_form_created(item) {
item.table_options.on_click = function() {
let first_detail = task.invoice_items.copy();
first_detail.set_where({invoice_id: item.id.value});
first_detail.table_options.height = 300;
first_detail.view_options.form_header = false;
first_detail.view_options.form_border = false;
first_detail.table_options.fields = ['product_id', 'unit_price', 'quantity', 'discount', 'total_price'];
first_detail.table_options.on_click = function() {
setTimeout(() => {
let second_detail = task.stock_movements.copy();
second_detail.set_where({reference_invoice_id: item.id.value, product_id: first_detail.product_id.value});
second_detail.table_options.height = 300;
second_detail.view_options.form_header = false;
second_detail.view_options.form_border = false;
second_detail.table_options.fields = ['product_id', 'movement_date', 'movement_type', 'warehouse_id', 'quantity']; //first_detail.table_options.on_click = function() {
second_detail.view(item.view_form.find('.second_table'));
second_detail.view_form.find('#new-btn, #edit-btn, #delete-btn').hide();
}, 200);
};
first_detail.view(item.view_form.find('.first_table'));
first_detail.view_form.find('#new-btn, #edit-btn, #delete-btn').hide();
}
}
...
As you can see, you can even add more details if you want: catch the item data in the variable, create a view for that item and place it in the proper div class.