skills.rest
UnityAppSuite
UnityAppSuiteOFFICIAL
Explore all skills by this author →
GitHub

client-scripts

Automate Frappe form UI customization with frappe.ui.form.on event handlers.

21|6|Updated Dec 3, 2025
Search Tags:#ui#javascript#customization#forms#client-side#dialogs#frappe
One-click install
npx skills add https://github.com/UnityAppSuite/frappe-claude --skill client-scripts
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: client-scripts
Source: https://github.com/UnityAppSuite/frappe-claude/tree/main/plugins/frappe-fullstack/skills/client-scripts
Command: npx skills add https://github.com/UnityAppSuite/frappe-claude --skill client-scripts

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Frappe client-side scripting patterns help developers implement reliable, consistent form behaviors and UI enhancements without ad-hoc code scattered across Doctype scripts.

Core Features & Use Cases

  • Standardized form event patterns (setup, onload, refresh, validate) to initialize, react to data, and enforce rules.
  • Field manipulation and dialogs for consistent UI/UX (show/hide fields, read-only, required, and custom dialogs).
  • UI customization with custom buttons and prompts to extend the Frappe desk experience.

Quick Start

Create or update a client script at the designated Doctype path (for example my_app/.../my_doctype.js) and register event handlers with frappe.ui.form.on to enable the intended form behaviors.

Frequently Asked Questions about client-scripts

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I customize Frappe form events using client-side scripts?▼

Customize Frappe form events by organizing scripts under the specific Doctype path and registering handlers with frappe.ui.form.on. This pattern standardizes setup, onload, refresh, and validate events to enforce rules and react to data changes.

What is the best way to manipulate fields and create custom dialogs in Frappe?▼

Manipulate Frappe fields and create custom dialogs by applying client-side UI behavior patterns within your form scripts. You can dynamically show or hide fields, set read-only states, mark required fields, and trigger custom dialogs for consistent UX.

How do I add custom buttons to the Frappe desk interface?▼

Add custom buttons to the Frappe desk interface by extending UI behavior within your Doctype client scripts. This approach uses standardized client-side customization patterns to safely inject prompts and buttons without scattering ad-hoc code.

Can I enforce validation rules on Frappe forms before saving?▼

Enforce validation rules on Frappe forms by binding logic to the validate event within frappe.ui.form.on. This ensures your client-side scripts check data integrity and block saving before the form submission completes.

Why should I use standardized patterns for Frappe client-side scripting?▼

Use standardized patterns for Frappe client-side scripting to implement reliable form behaviors and UI enhancements without scattering ad-hoc code. This ensures consistent UI/UX across Doctypes and simplifies maintenance of form events and field manipulation.

Related Skills

Explore More Software Engineering Skills→
Venkateshvenki404224Venkateshvenki404224
25

frappe-doctype-builder

Generate complete Frappe DocType JSON with fields, permissions, and layouts.

Community
Intermediate
RomualdPRomualdP

Server Actions Generator

Generate Next.js Server Actions with Zod validation and cache revalidation.

Community
Intermediate
Venkateshvenki404224Venkateshvenki404224
25

frappe-integration-test-generator

Generate Python integration tests for multi-DocType workflows in Frappe.

Community
Intermediate
puzzo-devpuzzo-dev

frappe-desk

Customize Frappe Desk workspaces, reports, portal pages, and Vue.js integrations.

Community
Advanced