Skip to content

Implement embedded form feature#685

Open
samarsingh6965 wants to merge 3 commits into
developmentfrom
feat/experiment_form_renderer
Open

Implement embedded form feature#685
samarsingh6965 wants to merge 3 commits into
developmentfrom
feat/experiment_form_renderer

Conversation

@samarsingh6965

Copy link
Copy Markdown
Contributor

This pull request introduces support for an "Embedded Form" feature, refines field handling in dialogs, and improves API flexibility for retrieving meta fields. The changes affect both backend Python and frontend JavaScript code, as well as configuration files. The main themes are feature enablement, API enhancements, and UI/UX improvements.

Feature Enablement:

  • Added a new use_embedded_form property to the Custom Property Setter DocType, including it in the JSON schema and property list, enabling toggling of embedded form functionality. [1] [2]
  • Registered a new embedded_form.bundle.js asset in hooks.py to support the embedded form feature on the frontend.

API and Backend Enhancements:

  • Updated the get_meta_fields method and its API wrapper to accept an include_tabs parameter, allowing callers to specify whether "Tab Break" fields should be included in the returned metadata. [1] [2] [3]

Frontend/UI Improvements:

  • Changed all calls from createFormDialog to the new _openForm method in the datatable mixins, standardizing form opening logic for different modes (view, write, create). [1] [2] [3] [4]
  • Improved field locking logic in form dialogs: fields with set_only_once are now always read-only in "write" (edit) mode, regardless of their value.
  • Refined the value extraction logic in form dialogs to exclude fields with set_only_once from being considered as value fields, preventing unintended updates.

Create
image

Edit
image

View (ReadOnly)
image

Copilot AI review requested due to automatic review settings June 11, 2026 12:32
@samarsingh6965 samarsingh6965 added the feat Introduces a new feature or functionality in the project. label Jun 11, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR introduces an “Embedded Form” capability that can render a linked DocType form inline (instead of a modal), adds configuration support for toggling it, and extends the meta-fields API to optionally include Tab Breaks so embedded/tabbed layouts can be built.

Changes:

  • Added Embedded Form rendering (standalone frappe_theme.embedded_form.render + DataTable inline panel mode) and routed DataTable “create/edit/view” actions through a unified _openForm helper.
  • Extended dt_api.get_meta_fields / DTConf.get_meta_fields with include_tabs to optionally return Tab Break fields.
  • Added a use_embedded_form toggle to Custom Property Setter and registered the new JS asset in hooks.py.

Reviewed changes

Copilot reviewed 8 out of 10 changed files in this pull request and generated 5 comments.

Show a summary per file
File Description
frappe_theme/public/js/overwrite_form.bundle.js Minor formatting/indentation adjustment in an existing template literal.
frappe_theme/public/js/embedded_form.bundle.js New public JS API to render an embedded form into an HTML field and expose an frm-like interface for client scripts.
frappe_theme/public/js/datatable/sva_datatable.bundle.js Mixes EmbeddedFormMixin into SvaDataTable so inline form routing is available.
frappe_theme/public/js/datatable/mixins/ui_setup.js Uses _openForm(..., \"create\") instead of directly calling createFormDialog.
frappe_theme/public/js/datatable/mixins/form_dialog.js Adjusts set_only_once behavior (always locked in write mode) and excludes such fields from update payload extraction.
frappe_theme/public/js/datatable/mixins/embedded_form.js New mixin implementing embedded form rendering, tab splitting, save flow, and _openForm routing between modal vs embedded panel.
frappe_theme/public/js/datatable/mixins/action_column.js Routes view/edit actions through _openForm to support embedded mode.
frappe_theme/hooks.py Registers embedded_form.bundle.js in app_include_js.
frappe_theme/frappe_theme/doctype/custom_property_setter/custom_property_setter.json Adds the use_embedded_form checkbox field to enable the feature via configuration.
frappe_theme/dt_api.py Extends whitelisted get_meta_fields with include_tabs.
frappe_theme/controllers/dt_conf.py Implements include_tabs filtering behavior for Tab Break fields in meta-field retrieval.

Comment on lines +128 to +137
// Fetch document for edit / view modes, store on instance for callers to reuse
let doc = {};
if (name && mode !== "create") {
try {
doc = await this.sva_db.get_doc(doctype, name);
} catch (e) {
console.warn(`[embedded_form] Could not fetch doc ${doctype}/${name}:`, e);
}
}
this._embedded_doc = doc;
f.options = `
<div class="form-group horizontal">
<div class="clearfix">
<label class="control-label" style="padding-right: 0px;">${f.label}</label>
<svg class="es-icon es-line icon-sm" aria-hidden="true">
<use href="#es-line-link"></use>
</svg>
<a href="${doc[f.fieldname]}" target="_blank">${doc[f.fieldname]}</a>
f.options = `
<div class="form-group horizontal">
<div class="clearfix">
<label class="control-label" style="padding-right: 0px;">${f.label}</label>
<svg class="es-icon es-line icon-sm" aria-hidden="true">
<use href="#es-line-link"></use>
</svg>
<a href="${doc[f.fieldname]}" target="_blank">${doc[f.fieldname]}</a>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feat Introduces a new feature or functionality in the project.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants