DHTMLX MCP Server
About
The DHTMLX MCP server provides real-time access to official docs and a smart RAG.
Details
- Author
- Unknown
- Categories
- Developer Tools, Knowledge Base
Jump to
The DHTMLX MCP server provides real-time access to official docs and a smart RAG.
DHTMLX Suite is a JavaScript UI library that includesGrid,Form,Chart,Tree,Calendar,Layout, and many other components, each with its own configuration properties, methods, and events. AI coding assistants often rely on training data that may not reflect the latest Suite releases, so generated code can reference outdated APIs, incorrect event names, or changed configuration options.
The DHTMLX MCP server gives AI tools direct access to the current Suite documentation while generating responses. By connecting an assistant to the MCP endpoint, developers get accurate initialization code, current method signatures, and correct configuration details for any Suite component, based on live documentation rather than stale training data.
The DHTMLX MCP server is a shared service for all major DHTMLX products, not only DHTMLX Suite. The configuration instructions apply to any DHTMLX component you are working with.
The MCP server indexes the full DHTMLX Suite documentation across all components. Common scenarios include:
- Looking up the current API for any Suite component, includingGrid,Form,Chart,Tree,Calendar, and others.
- Generating ready-to-run initialization and configuration code for any component based on a description.
- ConfiguringGridfeatures: sorting, filtering, inline editing, column resizing, and drag-and-drop between grids.
- BuildingFormlayouts with validation rules, built-in controls, and event-driven behavior.
- CreatingChartconfigurations across bar, line, pie, area, radar, and other chart types.
- Loading and managing data usingDataCollectionacross components.
- Handling component events to respond to user interactions, value changes, and data updates.
- Composing multiple components in a sharedLayoutwith rows, columns, and cells.
- ExploringTypeScript supportand integration withReact,Vue,Angular, andSvelte.
The DHTMLX MCP server uses a Retrieval-Augmented Generation (RAG) pipeline combined with the Model Context Protocol (MCP) to provide AI assistants with up-to-date documentation. Before any of that, the assistant first figures out which part of a request actually needs a documentation lookup and handles the rest from its own knowledge.
Here's what that looks like for the prompt"I want to create a layout with a calendar in one cell, and a grid in another,"one example among the many Suite components this same mechanism covers:
- The assistant sends the query through MCP.
- The server determines that it touches the Layout, Calendar, and Grid documentation.
- Since the answer requires generated code, the server routes the query toSearch, one of two workflows; a narrower factual question would route toInferenceinstead, which reads the same pages and answers directly.
- Searchretrieves the matching pages from a vector index built on the current documentation and sends them back to the assistant as context.
- The assistant configures the layout, calendar, and grid together using that context.
This approach allows AI tools to generate answers based on current documentation.
Most AI development tools allow adding MCP endpoints through either a CLI command or a JSON configuration file. The configuration generally consists of registering the MCP server URL.
Below are examples for commonly used tools.
Learn how to connect Claude Code with MCP in theofficial documentation.
The quickest way is to add the MCP server URL through the CLI:
claude mcp add --transport http dhtmlx-mcp https://docs.dhtmlx.com/mcp
Or if you prefer manual configuration, add this to your.mcp.json:
{ "mcpServers": { "dhtmlx-mcp": { "type": "http", "url": "https://docs.dhtmlx.com/mcp" } } }
For detailed instructions, see theofficial documentation.
- Open Settings (Cmd+Shift+Jon Mac,Ctrl+Shift+Jon Windows/Linux)
- Go toTools & MCP
- ClickAdd Custom MCP
- Paste this config:
{ "mcpServers": { "dhtmlx-mcp": { "url": "https://docs.dhtmlx.com/mcp" } } }
Learn more about connecting MCP servers in theofficial documentation.
- Open the command palette
- Type "mcp add"
- Select "HTTP"
- Provide the following values:
Check therelated guideto learn about migration from Gemini CLI to Antigravity CLI.
Createmcp_config.jsonin one of these locations:
- Global:~/.gemini/config/mcp_config.json
- Workspace:.agents/mcp_config.json
{ "mcpServers": { "dhtmlx-mcp": { "serverUrl": "https://docs.dhtmlx.com/mcp" } } }
For more information, consult theofficial documentation.
- Go toSettings→Apps & Connectors
- ClickAdvanced settings
- EnableDeveloper mode
- Return to theApps & Connectorsscreen and click "Create"
- Configure the connector:
Once added, ChatGPT can retrieve documentation from the MCP server during conversations.
For intensive coding workflows, other MCP-aware tools may be more efficient.
Most modern AI coding tools expose MCP under "Model Context Protocol", "Context Sources", or similar wording in settings. Addhttps://docs.dhtmlx.com/mcpas a custom source.
- It does not run locally.
- It does not access files in your environment.
- It does not store personal user information.
Queries may be logged for debugging and service improvements.
Organizations that require stricter privacy guarantees can request commercial deployment options with no query logging. For inquiries:info@dhtmlx.com.
Once you connect the MCP server, phrase your prompts around a concrete goal so the assistant knows which component and feature to look up. The prompts below are organized by component. Copy and adapt them as needed.
I want to create a grid with the possibility to sort, resize and edit column cells.
I want to create two grids with the possibility to drag item rows from one grid to another, but not vice versa.
How do I apply multiple filters to a DHTMLX Grid?
How do I add custom validation to DHTMLX Form? Use the docs.
How do I get all form values as an object and handle the afterSend event in DHTMLX Form?
I have a chart with the bar type, how can I also add a line chart above it?
How do I load data into a DHTMLX Chart from a JSON array?
I want to create a layout with a calendar in one cell, and a grid in another.
How do I resize layout cells and handle the resize event in DHTMLX Layout?
Related sample:Kanban and Chatbot. Example built with MCP
- Name the component.DHTMLX Suite contains many components, each with its own API. Always specify the component in your prompt (for example, "in DHTMLX Grid" vs. "in DHTMLX Form"). Without this, the assistant may retrieve documentation for the wrong component.
- Include the feature or behavior.Prompts like "drag-and-drop between two grids" or "form validation on send" retrieve more relevant documentation than a generic description. The more specific the feature, the more precise the retrieval.
- Add "Use the docs"to your prompt. This phrase signals to the assistant that it should trigger an MCP lookup instead of answering from training data alone. It is especially useful for event names, method signatures, and configuration properties that change between versions.
- Describe the expected interaction.Suite components often support multiple ways to achieve a goal (a configuration property, a method call, or an event handler). Describing the expected behavior helps the assistant pick the right approach.
This is a web browser that enables your coding agent, such as Claude Code, to visit websites on your behalf and assist you in identifying bugs or creating UI test cases.
MCP server that ingests project docs once and lets Claude search by meaning instead of reading everything — saving tokens on large codebases
Easily provide codebase context to Large Language Models (LLMs).
Provides up-to-date, version-specific documentation and code examples for libraries directly into your prompt.
Local codebase context compiler for AI coding agents, turning TypeScript/Node workspaces into compact, verifiable context packs.
The only RAG API built for Apple Development. Give your AI instant access to 100,000+ pages of official docs, recipes, and evolution proposals.
Free local RAG for Claude Code - Save tokens & time with vector search. Indexes markdown docs and finds relevant info without reading entire files (40x fewer tokens, 15x faster).
One shared context layer for AI agents and humans — live API specs, DB schemas, and versioned contracts across repos so every agent and teammate works from the same source of truth.
Local stdio MCP server that lets AI coding agents read and maintain structured architecture, rules, and decisions directly from your repository.
Official Context7 MCP server that brings up-to-date, version-specific library documentation and code examples into AI coding prompts.
Remote, no-auth MCP server providing AI-powered codebase context and answers
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.





