Skip to content

995304: Added Prompt Library content in Blazor common UG documentation and updated toc file #7229

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Backiaraj wants to merge 2 commits into
base: hotfix/hotfix-v31.2.12
Choose a base branch
from
Open

995304: Added Prompt Library content in Blazor common UG documentation and updated toc file #7229

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1a081d7
995304: Added Prompt Library content in Blazor common UG documentatio…
Backiaraj Dec 3, 2025
53e86da
Removed unwanted content
Backiaraj Dec 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 16 additions & 15 deletions blazor-toc.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,21 @@
<li>
<a href="/blazor/getting-started/razor-class-library">Razor Class Library in Visual Studio</a>
</li>
<li>
UI Kit
<ul>
<li><a href="/blazor/ui-kit/overview">Overview</a></li>
<li><a href="/blazor/ui-kit/getting-started">Getting Started</a></li>
<li><a href="/blazor/ui-kit/build-your-first-blazor-app-with-blocks">Build your first Blazor app with our blocks</a></li>
</ul>
</li>
<li>Tutorials
<ul>
<li>
<a href="/blazor/tutorials/build-a-blazor-stay-reservation-app">Build a Blazor Stay Reservation App</a>
</li>
</ul>
</li>
<li>Using Syncfusion.Blazor NuGet
<ul>
<li><a href="/blazor/getting-started/blazor-web-app-single-nuget">Blazor Web App</a></li>
Expand Down Expand Up @@ -133,25 +148,11 @@
</li>
</ul>
</li>
<li>
UI Kit
<ul>
<li><a href="/blazor/ui-kit/overview">Overview</a></li>
<li><a href="/blazor/ui-kit/getting-started">Getting Started</a></li>
<li><a href="/blazor/ui-kit/build-your-first-blazor-app-with-blocks">Build your first Blazor app with our blocks</a></li>
</ul>
</li>
<li>Tutorials
<ul>
<li>
<a href="/blazor/tutorials/build-a-blazor-stay-reservation-app">Build a Blazor Stay Reservation App</a>
</li>
</ul>
</li>
<li>AI Coding Assistant
<ul>
<li><a href="/blazor/ai-coding-assistant/overview">Overview</a></li>
<li><a href="/blazor/ai-coding-assistant/mcp-server">MCP Server</a></li>
<li><a href="/blazor/ai-coding-assistant/prompt-library">Prompt Library</a></li>
</ul>
</li>
<li>Smart (AI) Solutions
Expand Down
270 changes: 270 additions & 0 deletions blazor/ai-coding-assistant/prompt-library.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,270 @@
---
layout: post
title: Syncfusion AI Coding Assistant Prompt Library | Syncfusion
description: Explore the AI Coding Assistant Prompt Library to enhance Blazor development productivity with code generation, configuration examples, and contextual guidance.
control: Syncfusion AI Coding Assistant Prompt Library
platform: Blazor
documentation: ug
domainurl: ##DomainURL##
---

# Prompt Library - AI Coding Assistant

Speed up your Blazor projects using these ready-made prompts for popular Syncfusion components. Each prompt is short, easy to understand, and focused on real tasks—like quick setups, tweaks, and fixes.

## How to Use

Before starting, make sure your MCP Server is set up and running.

* Choose a prompt that fits your need.
* Copy the full prompt with the #SyncfusionBlazorAssistant handle.
* Customize the prompt for your specific use case.
* Execute via the MCP Server.
* Always check and test the code before adding it to your project.

## Component-Specific Prompts

### Grid

The Syncfusion Blazor Data Grid delivers fast, flexible tables for large datasets with built-in interactivity.

{% promptcards %}
{% promptcard Paging and Sorting %}
#SyncfusionBlazorAssistant How do I enable paging and sorting in the Syncfusion Blazor Grid?
{% endpromptcard %}
{% promptcard Grouping and Filtering %}
#SyncfusionBlazorAssistant Show me an example of grouping and filtering data in the Grid component.
{% endpromptcard %}
{% promptcard CRUD Operations %}
#SyncfusionBlazorAssistant What’s the code to implement full CRUD operations in Syncfusion Blazor Grid?
{% endpromptcard %}
{% promptcard Grid Export to PDF and Excel %}
#SyncfusionBlazorAssistant How can I add PDF and Excel export options to the Grid toolbar?
{% endpromptcard %}
{% promptcard Virtual Scrolling %}
#SyncfusionBlazorAssistant How do I configure virtual scrolling for large datasets in the Grid?
{% endpromptcard %}
{% promptcard Multicolumn Grid Setup %}
#SyncfusionBlazorAssistant Create a multicolumn Grid to display product details with sorting and filtering.
{% endpromptcard %}
{% promptcard Chat Integration %}
#SyncfusionBlazorAssistant How can I integrate a chat widget inside each row of the Syncfusion Grid?
{% endpromptcard %}
{% promptcard Advanced Grid Features %}
#SyncfusionBlazorAssistant Show me a Grid with paging, sorting, grouping, filtering, and virtual scrolling
{% endpromptcard %}
{% promptcard Troubleshooting Grid Export %}
#SyncfusionBlazorAssistant Why isn’t my Grid exporting to PDF and Excel correctly?
{% endpromptcard %}
{% promptcard Inline Editing %}
#SyncfusionBlazorAssistant How do I enable inline editing for CRUD operations in the Grid?
{% endpromptcard %}
{% promptcard Custom Toolbar %}
#SyncfusionBlazorAssistant Add custom toolbar buttons for PDF and Excel export in the Grid.
{% endpromptcard %}
{% promptcard Dynamic Column Configuration %}
#SyncfusionBlazorAssistant How can I dynamically configure multicolumn layout with filtering and sorting?
{% endpromptcard %}
{% endpromptcards %}

### Chart

The Syncfusion Blazor Chart suite offers versatile visualization tools across various series types for insightful data representation.

{% promptcards %}
{% promptcard Local and Remote Data %}
#SyncfusionBlazorAssistant How do I bind both local and remote data sources to a Syncfusion Chart?
{% endpromptcard %}
{% promptcard Range Selection %}
#SyncfusionBlazorAssistant Show me how to enable range selection in a Syncfusion Blazor Chart.
{% endpromptcard %}
{% promptcard Chart Types Overview %}
#SyncfusionBlazorAssistant What chart types are available in Syncfusion Blazor Chart and how to configure them?
{% endpromptcard %}
{% promptcard Markers and Data Labels %}
#SyncfusionBlazorAssistant How can I display markers and data labels on a line chart?
{% endpromptcard %}
{% promptcard Annotations %}
#SyncfusionBlazorAssistant Add custom annotations to highlight specific data points in a chart.
{% endpromptcard %}
{% promptcard Chart Export to Image or PDF %}
#SyncfusionBlazorAssistant How do I export a Syncfusion Chart to PDF or image format?
{% endpromptcard %}
{% promptcard Print Support %}
#SyncfusionBlazorAssistant Enable print functionality for a Syncfusion Blazor Chart component.
{% endpromptcard %}
{% promptcard Dynamic Chart with Remote Data %}
#SyncfusionBlazorAssistant Create a chart that updates dynamically with remote API data.
{% endpromptcard %}
{% promptcard Multiple Series Types %}
#SyncfusionBlazorAssistant How do I combine bar and line chart types in a single Syncfusion Chart?
{% endpromptcard %}
{% promptcard Troubleshooting Chart Data Binding %}
#SyncfusionBlazorAssistant Why isn’t my remote data showing up in the Syncfusion Chart?
{% endpromptcard %}
{% promptcard Interactive Range Selector %}
#SyncfusionBlazorAssistant Configure a range selector for zooming and filtering in a time-series chart.
{% endpromptcard %}
{% promptcard Custom Markers and Labels %}
#SyncfusionBlazorAssistant Show me an example of customizing chart markers and data label styles.
{% endpromptcard %}
{% endpromptcards %}

### Schedule

The Syncfusion Blazor Schedule component helps manage events, resources, and timelines with powerful views and customization.

{% promptcards %}
{% promptcard Remote Data Binding %}
#SyncfusionBlazorAssistant Bind the Schedule component to a remote API for dynamic event loading.
{% endpromptcard %}
{% promptcard CRUD Actions %}
#SyncfusionBlazorAssistant Show me how to implement full CRUD operations in the Schedule component.
{% endpromptcard %}
{% promptcard Virtual Scrolling %}
#SyncfusionBlazorAssistant Enable virtual scrolling for large event datasets in the Schedule view.
{% endpromptcard %}
{% promptcard Timezone Support %}
#SyncfusionBlazorAssistant How can I configure timezone support in the Syncfusion Blazor Schedule?
{% endpromptcard %}
{% promptcard Export Schedule to PDF or Excel %}
#SyncfusionBlazorAssistant Add export functionality to download the Schedule view as PDF or Excel.
{% endpromptcard %}
{% promptcard Timeline Header Rows %}
#SyncfusionBlazorAssistant How do I customize timeline header rows in the Schedule component?
{% endpromptcard %}
{% promptcard Troubleshooting Schedule CRUD %}
#SyncfusionBlazorAssistant Why aren’t my CRUD actions working correctly in the Schedule component?
{% endpromptcard %}
{% promptcard Local and Remote Data %}
#SyncfusionBlazorAssistant Bind both local and remote event data to the Schedule component.
{% endpromptcard %}
{% promptcard Export and Timezone %}
#SyncfusionBlazorAssistant Configure timezone-aware exporting for the Schedule view.
{% endpromptcard %}
{% endpromptcards %}

### Kanban

The Syncfusion Blazor Kanban organizes tasks in columns with drag-and-drop, swimlanes, and templating for agile workflows.

{% promptcards %}
{% promptcard Data Binding %}
#SyncfusionBlazorAssistant How do I bind local or remote data to the Syncfusion Blazor Kanban board?
{% endpromptcard %}
{% promptcard Sorting %}
#SyncfusionBlazorAssistant Enable sorting of cards within columns in the Kanban component.
{% endpromptcard %}
{% promptcard Swimlane View %}
#SyncfusionBlazorAssistant Show me how to group Kanban cards using swimlane headers.
{% endpromptcard %}
{% promptcard Kanban Card Editing %}
#SyncfusionBlazorAssistant How can I enable inline editing of Kanban cards?
{% endpromptcard %}
{% promptcard Virtualization %}
#SyncfusionBlazorAssistant Configure virtualization for performance with large Kanban datasets.
{% endpromptcard %}
{% promptcard Localization %}
#SyncfusionBlazorAssistant How do I localize labels and messages in the Kanban component?
{% endpromptcard %}
{% promptcard Drag and Drop %}
#SyncfusionBlazorAssistant Enable drag-and-drop functionality for moving cards between columns.
{% endpromptcard %}
{% promptcard Sorting and Swimlane %}
#SyncfusionBlazorAssistant Create a Kanban board with swimlane grouping and sortable cards.
{% endpromptcard %}
{% promptcard Editable Cards and Localization %}
#SyncfusionBlazorAssistant Show me how to edit cards and apply localization in Kanban.
{% endpromptcard %}
{% promptcard Troubleshooting Kanban Drag and Drop %}
#SyncfusionBlazorAssistant Why isn’t drag-and-drop working correctly in my Kanban board?
{% endpromptcard %}
{% promptcard Remote Data and Virtualization %}
#SyncfusionBlazorAssistant Bind remote data to Kanban and enable virtualization for performance.
{% endpromptcard %}
{% promptcard Advanced Kanban Setup %}
#SyncfusionBlazorAssistant Create a Kanban board with data binding, swimlane, card editing, and drag-and-drop.
{% endpromptcard %}
{% endpromptcards %}

### RichTextEditor

The Syncfusion Blazor RichTextEditor offers a modern WYSIWYG editor with extensive formatting, media, and integration features.

{% promptcards %}
{% promptcard Toolbar Configuration %}
#SyncfusionBlazorAssistant How do I customize the toolbar options in the Syncfusion RichTextEditor?
{% endpromptcard %}
{% promptcard Link Manipulation %}
#SyncfusionBlazorAssistant Show me how to add, edit, and remove hyperlinks in RichTextEditor content.
{% endpromptcard %}
{% promptcard Iframe Mode %}
#SyncfusionBlazorAssistant How can I render the RichTextEditor inside an iframe for isolated styling?
{% endpromptcard %}
{% promptcard Undo and Redo %}
#SyncfusionBlazorAssistant Enable undo and redo functionality in the RichTextEditor toolbar.
{% endpromptcard %}
{% promptcard Forms Integration %}
#SyncfusionBlazorAssistant How do I integrate a Blazor form and validate input?
{% endpromptcard %}
{% promptcard Content Import and Export %}
#SyncfusionBlazorAssistant Export RichTextEditor content to HTML or import existing HTML content.
{% endpromptcard %}
{% promptcard Advanced Toolbar %}
#SyncfusionBlazorAssistant Create a RichTextEditor with toolbar options for formatting, links, and undo/redo.
{% endpromptcard %}
{% promptcard Iframe and Forms Support %}
#SyncfusionBlazorAssistant Use RichTextEditor in iframe mode and bind it to a form for submission.
{% endpromptcard %}
{% promptcard Undo/Redo and Export %}
#SyncfusionBlazorAssistant Enable undo/redo and export content to HTML in RichTextEditor.
{% endpromptcard %}
{% endpromptcards %}

### Calendar

The Syncfusion Blazor Calendar supports flexible date selection, localization, and custom rendering.

{% promptcards %}
{% promptcard Date Range Selection %}
#SyncfusionBlazorAssistant How do I enable date range selection in the Syncfusion Blazor Calendar?
{% endpromptcard %}
{% promptcard Globalization Support %}
#SyncfusionBlazorAssistant Configure the Calendar to support multiple cultures and languages.
{% endpromptcard %}
{% promptcard Multi-Date Selection %}
#SyncfusionBlazorAssistant Show me how to allow users to select multiple dates in the Calendar.
{% endpromptcard %}
{% promptcard Islamic Calendar Support %}
#SyncfusionBlazorAssistant How can I switch the Calendar to use the Islamic calendar system?
{% endpromptcard %}
{% promptcard Skip Months Feature %}
#SyncfusionBlazorAssistant Enable skipping months in the Calendar navigation for faster browsing.
{% endpromptcard %}
{% promptcard Calendar Showing Other Month Days %}
#SyncfusionBlazorAssistant How do I show days from adjacent months in the current Calendar view?
{% endpromptcard %}
{% promptcard Custom Day Cell Format %}
#SyncfusionBlazorAssistant Customize the day cell format in the Calendar to show short weekday names.
{% endpromptcard %}
{% promptcard Calendar Highlighting Weekends %}
#SyncfusionBlazorAssistant Highlight weekends in the Calendar with a different background color.
{% endpromptcard %}
{% promptcard Globalization and Islamic Calendar %}
#SyncfusionBlazorAssistant Configure the Calendar for Arabic culture using Islamic calendar and localization.
{% endpromptcard %}
{% promptcard Multi-Selection and Range %}
#SyncfusionBlazorAssistant Enable both multi-date selection and range selection in the Calendar.
{% endpromptcard %}
{% promptcard Troubleshooting Calendar Date Range %}
#SyncfusionBlazorAssistant Why isn’t my Calendar selecting the correct date range?
{% endpromptcard %}
{% promptcard Advanced Calendar Setup %}
#SyncfusionBlazorAssistant Create a Calendar with date range, multi-selection, globalization, and weekend highlights.
{% endpromptcard %}
{% endpromptcards %}

## See also

* [AI Coding Assistant Overview](https://blazor.syncfusion.com/documentation/ai-coding-assistant/overview)
* [SyncfusionBlazorAssistant MCP Server](https://blazor.syncfusion.com/documentation/ai-coding-assistant/mcp-server)